梅科尔工作室-张敏-鸿蒙笔记3

1. List组件

List组件和ListItem容器一般一起使用，List是一个大容器，ListItem是大容器里的小容器

示例：

2、父子组件（自定义组件）

①子组件导出用export语句

②父组件导入用import {子组件文件名称} from "子组件文件相对路径"

③双向数据绑定

改变任何一方数据时，两方数据都会变为改变的一方数据

子组件中数据用@Link修饰

父组件中用@State修饰，在子组件接口中数据用$修饰

3、条件渲染

①if/else渲染可以改变组件的渲染状态，即决定组件是否在页面中被渲染。if括号内的变量是true的话，则对应下的组件都被渲染，否则都不被渲染。

注意事项

必须在容器组件内使用。

使用if/else可以使子组件的渲染依赖条件语句。

②示例

使用if条件语句：

使用if、else if、else条件语句：

4、通过循环渲染（ForEach）从数组中获取数据，并为每个数据项创建相应的组件，可减少代码复杂度。

示例：

ForEach(

arr: any[],

itemGenerator: (item: any, index?: number) =>void,

keyGenerator?: (item: any, index?: number) =>string

)

参数：

注意事项

必须在容器组件内使用；

生成的子组件允许在ForEach的父容器组件中，允许子组件生成器函数中包含if/else条件渲染，同时也允许ForEach包含在if/else条件渲染语句中；