在开发一个组件中,需要用到改组件在不同的父页面中靠左对齐与居中对齐,这时候需要组件接受外部传入的样式类。此时可以在 Component 中用 externalClasses 定义段定义若干个外部样式类
代码如下:
<!-- 页面的 WXML -->
<Logo my-class="text-align-left" />
<Logo my-class="text-align-center" />
.text-align-left {
text-align: left;
}
.text-align-center {
text-align: center;
}
组件代码如下:
/* 组件 index.js */
Component({
externalClasses: ['my-class']
})
<!-- 组件 index.wxml -->
<view class="my-class">这段文本的对齐方式由组件外的 class 决定</view>
⚠️: 在同一个节点上使用普通样式类和外部样式类时,两个类的优先级是未定义的,因此最好避免同时使用。