• 文件后缀 .ets 也是 ArkTS 的标志性特征
• 代码中的 @Entry、@Component、@State 是 ArkTS 特有的装饰器，用于声明页面入口、自定义组件、状态变量

@Entry的作用 入口装饰器

• 标记一个 @Component 组件为应用的入口页面（即应用启动后第一个展示的页面）
• 一个应用的单个模块中，通常只有一个 @Entry 组件（多了会导致启动入口混乱）

@Component作用

• 标记一个 struct 为自定义组件，让这个结构体具备鸿蒙 UI 组件的能力
• 被 @Component 标记的 struct 必须包含 build() 方法（唯一且必须）
• 一个鸿蒙应用中可以有多个 @Component 组件（比如封装按钮、卡片等复用组件）

@State作用

• 是 ArkTS 中的状态变量装饰器，用来标记组件内的一个变量为「响应式状态」
• 给变量加上 @State 后，这个变量就和 UI 组件 “绑定” 了 —— 当变量的值发生变化时，鸿蒙系统会自动重新执行组件的 build() 方法，更新所有用到这个变量的 UI 元素
• 解决「数据变化后 UI 自动更新」的问题。如果没有 @State，即使你修改了变量的值，界面上显示的内容也不会变（因为 UI 不会主动刷新）
• @State 标记的变量只在当前组件内生效，是组件的 “私有状态”
• 只有变量的值发生实质性变化（比如字符串内容、数字大小、布尔值切换），才会触发 UI 刷新
• @State 变量必须在声明时初始化（不能只声明不赋值）
  代码实例：

@Component
struct MyButton { // 标记为UI组件
  build() { // 必须有build方法渲染UI
    Button("点击我")
      .fontSize(30)
      .backgroundColor(Color.Blue);
  }
}

@Entry
@Component
struct Index { // 既是UI组件，也是应用入口
  @State message: string = 'Hello World';

  build() {
    Row() {
      Column() {
        Text(this.message)
          .fontSize(50)
          .fontWeight(FontWeight.Bold);
        MyButton() // 复用上面定义的普通组件
      }
      .width('100%')
    }
    .height('100%')
  }
}

工程项目目录

• 其中 .hvigor 是存储构建配置信息的文件，开发的时候暂时无关，打包发布有关
• .idea 与开发工具有关的配置
• appscope 全局的共享资源存放目录
• entry 工程模块目录
• hvigor前端构建配置文件的信息
• oh_moduls 项目所有用到的第三方包
• build-profile.json5 工程级配置信息
• hvigorfile.ts 编译构建任务脚本
• oh-package.json5 主要用来描述全局配置

entry 工程模块目录

• src 源代码目录
  src———main 核心的代码
  |
  |
  ——ohostest 做单元测试的代码
• build-profile.json5 模块级别的配置信息
• hvigorfile.ts模块级别脚本
• oh-package.json5模块级别的依赖

main———ets arkts的源代码目录 写代码写到这里边
|
|
——resources

• src/main/module.json5 这个是模块的配置信息

扩展

src/main/ets/entryability/EntryAbility.ets 主要用做逻辑和生命周期的管理
src/main/ets/pages 主要用做界面ui的管理
这样就做到了界面和逻辑的分离

具备语法
ts语法速通