HarmonyOS 开发 代码结构明晰（ArkUI）

1.结构说明

2，代码截图说明

3、运行结果（按钮案列）

import router from '@ohos.router';
@Entry
@Component
struct ButtonCase1 {
  build() {
    List({ space: 4 }) {
      ListItem() {
        Button("First").onClick(() => {
          router.pushUrl({ url: 'pages/first_page' })
        })
          .width('100%')
      }
      ListItem() {
        Button("Second").onClick(() => {
          router.pushUrl({ url: 'pages/second_page' })
        })
          .width('100%')
      }
      ListItem() {
        Button("Third").onClick(() => {
          router.pushUrl({ url: 'pages/third_page' })
        })
          .width('100%')
      }
    }
    .listDirection(Axis.Vertical)
    .backgroundColor(0xDCDCDC).padding(20)
  }
}

运行结果