ForEach循环渲染
详见链接:
https://www.malaoshi.top/show_1GW570S1SaU.html
代码
const SOUNDS:Array<Array<string>> = [
['声音1', 'a_muyu1.mp3'],
['声音2', 'a_muyu2.mp3'],
['声音3', 'a_muyu3.mp3'],
['声音4', 'a_muyu4.mp3'],
['声音5', 'a_muyu5.mp3'],
['声音6', 'a_muyu6.mp3'],
]
@Entry
@Component
struct ForEachDemo {
@State message: string = 'Hello World';
build() {
Column() {
// 铃声列表
List() {
ForEach(SOUNDS, (item:Array<string>,index:number)=>{
ListItem() {
Row() {
Text(item[0])
.fontSize(20)
Radio({
value: item[1],
group: "type"
})
}
.width('100%')
.justifyContent(FlexAlign.SpaceBetween)
}
.padding({
top: 15,
bottom: 15,
left: 5
})
})
}
.width('90%')
.height('100%')
.divider({
//设置分割线
strokeWidth: 1,
color: '#333',
// startMargin: 10,
// endMargin: 10
})
.scrollBar(BarState.On) // 显示滚动条
}
.height('100%')
.width('100%')
}
}
