小程序子组件引用父组件样式

相关文档链接：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 支持驼峰命名