公告列表
公告列表
收藏
回答

weui按钮样式丢失

使用weui css中的class添加到button上，现在安卓和苹果都出现了按钮看不到的情况，但是实际上按钮还在，点击空白区域是可以触发click事件，这个问题在真机上必现，小程序最近没有发布过，很多用户上报过这种情况

样例代码

<button slot="footer" type="primary" class="weui-btn" bindtap="handleConfirm" disabled="{{!selected}}">确认进入</button>


回答关注问题邀请回答
收藏

6 个回答

  • 社区技术运营专员--阳光
    社区技术运营专员--阳光
    11-07

    请具体描述问题出现的流程，并提供能复现问题的简单代码片段（https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html）。

    11-07
    有用
    回复 8
    • X
      X
      11-07
      https://developers.weixin.qq.com/s/svC9wwmp7QVj
      我试了一下，应该是全局样式失效了，我在weui.wxss中修改了(--primary-color)，在开发者工具中预览是正常生效的，但是真机调试和预览就没有生效，所以现在怀疑是css的问题。
      但是线上小程序最近都没有发布，突然出现了这样的问题
      11-07
      赞
      回复
    • X
      X
      11-07
      通过属性选择器修改的样式，button[type=primary] {......}
      11-07
      赞
      回复
    • X
      X
      11-07
      定位到问题了，renderer：skyline以及对应的配置不加，按钮就看不到了
      11-07
      赞
      回复
    • 社区技术运营专员--阳光
      社区技术运营专员--阳光
      11-07回复X
      我们看下
      11-07
      赞
      回复
    • Albus🔖
      Albus🔖
      11-07回复社区技术运营专员--阳光
      我们也有同样的问题，Half Screen Dialog里涉及到CSS变量的样式全都失效了，比如组件里使用的class里用到了参数变量（比如--primary-color)，就失效了，这个要怎么解决
      11-07
      赞
      回复
    查看更多(3)
  • yaime
    yaime
    11-15

    我的weui的dialog和half-screen-dialog也遇到了同样的问题，以下是我的三个可以解决的方案

    1. 真机调试去看实际渲染的class值，会发现安卓机的渲染的class会变成一个xxxx--{{extClass}}这样的值而不是extClass值，可以直接在css中添加这个对应的选择器来改变样式
    2. 到weui的git库中找到798ac7b之前的提交，然后将收到影响的组件本地copy一遍，只需要将全局的组件引用都统一修改就好，这个修改量最小
    3. https://github.com/wechat-miniprogram/weui-miniprogram/issues/255 最新的weui分支已经revert了之前的修改，理论上来说新版本覆盖后这个问题不会再出现，但是不知道啥时候能推全。
    11-15
    有用
    回复
  • Albus🔖
    Albus🔖
    11-07

    同样的问题，Half Screen Dialog里涉及到CSS变量的样式全都失效了

    11-07
    有用
    回复
  • 虾仁鱼🍤🚶🐠
    虾仁鱼🍤🚶🐠
    11-07

    好奇怪！我也出现了类似的情况，从昨天开始陆陆续续收到用户反馈。<Half Screen Dialog>和<Dialog>内的自定义内容都出现了不同程度的异常，小程序几周内都没有代码更新，突然就变成这样了

    11-07
    有用
    回复 1
  • 一笑皆春
    一笑皆春
    11-07

    调试看看什么样式影响的，估计是全局的样式

    11-07
    有用
    回复
  • 正好时光
    正好时光
    11-07

    按钮还在，看看是不是背景色被白色覆盖了

    11-07
    有用
    回复 2
    • X
      X
      11-07
      半屏弹窗插槽用的纯原生的写法，没有遮罩盖住
      11-07
      赞
      回复
    • 正好时光
      正好时光
      11-07回复X
      编辑器选中检查一下，是不是被全局样式给覆盖了
      11-07
      赞
      回复
请 登录 后发表内容
相关问题
相关文档