内联样式接受动态样式,在运行时会进行解析,用于控制样式的调整。定义单一元素,或使用中发生较大变化的元素。
类样式是用于统一类型的多个元素,重复使用的元素,从而减少重复代码的数量。
举例如下:
index.wxml
<view wx:for="{{data}}" wx:key="*this" class="block" style="{{item.style}}">
Block{{index}}
<view>{{item.title}}</view>
</view>
index.wxss
.block
{
background-color: #eee;
margin: 10rpx 0rpx;
}
index.js
Page({
data: {
data:[
{
"title":"Hi,NetEase",
"style":"color:#ff00ff"
},
{
"title":"HelloNetEase",
"style":"color:#00ff00"
}
]
},
这个为效果图。
这里wx:key是一个难点,如果像了解,请看我的另一个博客。https://blog.csdn.net/abudula__/article/details/81144390