微信小程序给button设置背景色后，点击时的样式button-hover失效

Question

发现小程序的button组件在设置了背景色后（不设置type类型的情况下），点击时的默认button-hover不生效了，请问有什么解决方法吗？

Answer 1

可以

<button style="background:red;" hover-class="green">123</button>
.green {
  background: green !important;
}

Answer 2

重新写一下hover的样式吧，目测是权重高于:hover伪类了。

Answer 3

我在微信小程序中用button都是用模拟的，然后button设置 opacity: 0;

<view class='contact_btn'>
    <button class='btn_contact' open-type="contact"></button>
</view>

.contact_btn {
  position: relative;
  width: 44rpx;
  height: 44rpx;
  margin-left: 10rpx;
}
.btn_contact {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height:100%;
  opacity: 0;
}

Answer 4

你这个在手机实机上测过了吗？另外，你在开发工具里点击的按钮，在调试工具wxml里面看看按下的时候有没有button-hover在class里的添加，我试了一下，设置背景色，不写type在开发工具下看不出效果，但是在手机上还是有那个hover样式的一个灰色蒙版