美文网首页
微信小程序 - 子组件如何继承使用class样式

微信小程序 - 子组件如何继承使用class样式

作者: coderfl | 来源:发表于2020-03-24 22:33 被阅读0次

    一般情况下,小程序无法使用父组件和全局的样式

    // 父组件
    "usingComponents": {
        "w-tc": "./testChild/index"
      }
    <text class="red">pages/test/index.wxml</text>
    <w-tc/>
    
    // 子组件
    <view class="red">pages/test/testChild/index.wxml</view>
    
    // app.wxss
    .red{
      color: red;
    }
    
    image.png

    这样操作后就可以把父页面中的class样式传递到子组件中使用

    // 组件 js
    Component({
      externalClasses: ['parent-class']
    });
    // 组件 wxml
    <view class="parent-class"></view>
    // 父页面 wxml
    <w-more-img parent-class="myWrap"/>
    
    // ***** class名不能使用驼峰,否则不生效 *****
    

    相关文章

      网友评论

          本文标题:微信小程序 - 子组件如何继承使用class样式

          本文链接:https://www.haomeiwen.com/subject/icczyhtx.html