ArkTs 装饰器

ArkTs 装饰器

ArkTs 的装饰器分为状态管理装饰器与行为装饰器

行为装饰器

@Component

Component 修饰符可以将一个结构体 struct 标记为自定义的组件。

@Entry

Entry 则是将一个组件标记为一个入口页面。

那么也就是说同一个组件节点树中不能同时存在2个或多个 Entry 标记

@Builder

Builder 修饰符就比较有意思了。

React 中使用的是 JSX 语法，他的优点就是可以通过函数抽离出当前页面中使用次数多，但并非公共的组件。

Builder 修饰符的功能类似。你可以在这个 struct 中抽离你认为的使用频率多的组件。

状态管理装饰器

@State

state装饰器使用来声明一个响应式的变量，当我们操作这个变量时，视图也会相应进行改变。

与 Vue 的响应式变量类似。

我们声明的基本类型的数据 如：string、number、boolean、null、undefined。都是可以响应式改变的

对于引用类型的数据，也是深度监听。

比如对象啊，数组啊。

对于对象类型，如果只学习使用过 Vue2 的同学们来讲可能有一些情况

-- 由于 Vue2 采用的是 getter,setter 的形式添加响应式的，对于一些在对象初始化时没有的属性是监听不到的，为此 Vue2 提供的解决方案是通过 $set 来为一个对象的属性添加响应式。

-- 相比较之下 Vue3 通过 Proxy 能够捕捉到对象的任何改变对象的操作。不再需要借助 $set 的帮助。

@State 的响应式声明也是如此。你可以进行任何你想要的操作，build-in 的行为已足够满足你的需求

@Prop

Prop 则是声明一个组件的属性，单向的数据流，当然你也可以在组件的内部进行修改，但是结果可能不会像你想象的那样顺利。

如果真的需要修改父组件的数据，请考虑更换其他修饰符

@Link

Link 修饰符给我的感觉更像是一个 v-model ，一个父子组件双向数据绑定的一个桥梁。

你可以通过 Link 修饰符在子组件中修改父组件传入的数据，同时，父组件也能捕捉到子组件进行了修改，然后显示在页面中。