小程序-外部样式类

2,362 阅读1分钟

在开发一个组件中,需要用到改组件在不同的父页面中靠左对齐与居中对齐,这时候需要组件接受外部传入的样式类。此时可以在 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>

⚠️: 在同一个节点上使用普通样式类和外部样式类时,两个类的优先级是未定义的,因此最好避免同时使用。