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

阿衰写代码

于 2023-07-26 23:41:32 发布

阅读量383

点赞数 2

分类专栏：鸿蒙开发文章标签： harmonyos 华为

本文链接：https://blog.youkuaiyun.com/qq_42215417/article/details/131949914

版权

鸿蒙开发专栏收录该内容

10 篇文章

订阅专栏

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)
  }
}

运行结果

在这里插入图片描述