list组件
- 由list容器组件和listitem容器组件构成,list是一个大容器,listitem是大容器里的小容器
-
Item:ActionScript 对象,通常包含 label 属性和 data 属性,前者是描述性的属性,后者用于存储与项目关联的数据。
-
Row :用于显示项目的组件。
-
Data provider:一个组件,用于模拟 List 组件所显示的项目。
父子组件
- 子组件导出用export语句
-
父组件导入用import {子组件文件名称} from "子组件文件相对路径"双向数据绑定
-
改变任何一方数据时,两方数据都会变为改变的一方数据
- 子组件中数据用@Link修饰父组件中用@State修饰,在子组件接口中数据用$修饰
-
if-else渲染
v-if指令用于条件性地渲染一块内容,这块内容只会在指令的表达式返回truth值的时候被渲染。 v-else和v-else-if都必须紧跟在v-if的后面使用(v-else-if可以跟在v-else-if后面)
for循环渲染
循环渲染
通过循环渲染(ForEach)从数组中获取数据,并为每个数据项创建相应的组件,可减少代码复杂度。
- ForEach(
- arr: any[],
- itemGenerator: (item: any, index?: number) => void,
- keyGenerator?: (item: any, index?: number) => string
- )
参数:
参数名 | 参数类型 | 必填 | 参数描述 |
---|---|---|---|
arr | any[] | 是 | 必须是数组,允许设置为空数组,空数组场景下将不会创建子组件。同时允许设置返回值为数组类型的函数,例如arr.slice(1, 3),设置的函数不得改变包括数组本身在内的任何状态变量,如Array.splice、Array.sort或Array.reverse这些改变原数组的函数。 |
itemGenerator | (item: any, index?: number) => void | 是 | 生成子组件的lambda函数,为数组中的每一个数据项创建一个或多个子组件,单个子组件或子组件列表必须包括在大括号“{...}”中。 |
keyGenerator | (item: any, index?: number) => string | 否 | 匿名函数,用于给数组中的每一个数据项生成唯一且固定的键值。当数据项在数组中的位置更改时,其键值不得更改,当数组中的数据项被新项替换时,被替换项的键值和新项的键值必须不同。键值生成器的功能是可选的,但是,为了使开发框架能够更好地识别数组更改,提高性能,建议提供。如将数组反向时,如果没有提供键值生成器,则ForEach中的所有节点都将重建。 |
说明