时间: 2020-08-23|22次围观|0 条评论

相关文档链接:https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/wxml-wxss.html#%E5%A4%96%E9%83%A8%E6%A0%B7%E5%BC%8F%E7%B1%BB

通过文档可知,小程序自定义组件有名为externalClasses的属性,可以以数组字符串的方法引入父组件的样式

示例方法如下:

子组件

/* 组件 custom-component.js */Component({  externalClasses: ['my-class']})
<!-- 组件 custom-component.wxml --><custom-component class="my-class">这段文本的颜色由组件外的 class 决定</custom-component>

父组件

<!-- 页面的 WXML --><custom-component my-class="red-text" />
/* 页面的 WXSS */.red-text {  color: red;}
注:此处有个坑点,externalClasses是一个字符串数组,但我再具体应用过程中发现,里面的字符串命名方式对驼峰命名不友好,如上面的“my-class”写成“myClass”,在实际应用中会失效
社区上有相关讨论,感兴趣可以看下externalClasses 支持驼峰命名

文章转载于:https://www.jianshu.com/p/482cdd89b913

原著是一个有趣的人,若有侵权,请通知删除

本博客所有文章如无特别注明均为原创。
复制或转载请以超链接形式注明转自起风了,原文地址《小程序子组件引用父组件样式
   

还没有人抢沙发呢~