收藏
回答

自定义组件会影响其它样式文件中使用的伪元素样式

问题模块
API和组件

例如A页面当中一旦引用自定义组件如:

"usingComponents": {
        "min-mask": "../../min-components/min-mask/min-mask",
        "min-popup": "../../min-components/min-popup/min-popup",
        "min-iconfont": "../../min-components/min-iconfont/min-iconfont"
    }


然后A页面引入的其他样式文件如button.wxss中的伪元素会受到影响,不会正常显示其原有的样式,去掉A.json文件中引用自定义组件的代码后,button.wxss的样式显示正常。但是button.wxss中的其它常用的非伪元素样式则不受影响。


比如使用:after伪元素不会显示其中data-label属性的value值,去掉引用自定义组件代码后,data-label属性的value值正常显示

.speed-dial-button[data-label]:after {
    content: attr(data-label);
    position: absolute;
    /* left: 0; */
    top: 50%;
    transform: translate3d(0, -50%, 0);
    padding: 4px 10px;
    font-size: 12px;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 3px;
    color: rgba(255, 255, 255, 0.8);
    pointer-events: none;
    white-space: nowrap;
    opacity: 0;
    box-sizing: border-box;
    transition: all 0.3s;
}
 
.speed-dial-opened .speed-dial-button[data-label]:after {
    opacity: 1;
}


折腾了很长时间不知道是怎么回事,求大神指导







最后一次编辑于  2017-11-22  (未经腾讯允许,不得转载)
回答关注问题邀请回答
收藏

14 个回答

  • LastLeaf
    LastLeaf
    2017-12-12

    按照目前框架的设计, WXSS中 [data-xxx] 这样的选择器会失效。如果你遇到的是这个问题,我们会考虑做一个兼容。

    2017-12-12
    赞同
    回复
  • LastLeaf
    LastLeaf
    2017-12-12

    @勿忘 帖主的这个问题比较特殊,应该并不是一样的问题。

    2017-12-12
    赞同
    回复
  • LastLeaf
    LastLeaf
    2017-11-22

    确认为属性选择器的问题。请尽可能避免在wxss中涉及节点属性。


    之后我们会考虑做兼容性的修复。

    2017-11-22
    赞同
    回复
  • LastLeaf
    LastLeaf
    2017-11-22

    在页面中使用时,属性选择器也无法选中自定义组件节点。应当采用类选择器。

    2017-11-22
    赞同
    回复
  • LastLeaf
    LastLeaf
    2017-11-22

    你好,自定义组件中禁用属性选择器。调试器中会有错误提示的。

    2017-11-22
    赞同
    回复
  • Sunsky
    Sunsky
    2017-12-12

    我的情况是引用了自定义组件usingComponents后会对页面中调用的其它样式中的伪元素中的属性选择器产生影响,对其它的样式不会产生影响,有且仅有带有属性选择器的伪元素会受到影响,形如.class:after[label='test']{}这种会有影响,其它样式不受影响。去掉usingComponents之后会恢复原来样式的效果,目前官方可能不会对其做出修改,用其它非伪元素替代即可

    2017-12-12
    赞同
    回复
  • 勿忘
    勿忘
    2017-12-12

    另外能否回答一下我上午11:58发的另一个问题:

    真机上wx:for循环的列表,只有第一个的图片能正确生成,是什么情况? 


    2017-12-12
    赞同
    回复
  • 勿忘
    勿忘
    2017-12-12

    希望尽快兼容。

    2017-12-12
    赞同
    回复
  • 勿忘
    勿忘
    2017-12-12

    我在某个页面引入了一个组件,然后这个页面的data-*的属性就不能正确生成了。

    2017-12-12
    赞同
    回复
  • 勿忘
    勿忘
    2017-12-12

    遇到了同样的问题,组件影响的它所在页面样式的兼容,求问最后怎么处理了呢?

    2017-12-12
    赞同
    回复

正在加载...