梅科尔工作室-寒假培训-鸿蒙第三课-list组件，父子组件和渲染

一、list组件：

由List与ListItem组成

使用如下

示例：

 结果

具体可调参数 见如下网站List-容器组件-组件-组件参考（基于ArkTS的声明式开发范式）-手机、平板、智慧屏和智能穿戴开发-ArkTS API参考-HarmonyOS应用开发

 二、父子组件（可以自己设置一些组件）

创建子组件：先在MainAbility下创建一个目录，然后在这个文件夹下创建一个ARKts File，命名为child（子组件）

然后内部框架如下，在build内书写组件内容（@Component指的是将这个组件封装。）。

导入子组件：再回到原来的Pages下的index.ets，在上方写下如下内容导入。

import{child}from"../common/child"//"../common/child指的是路径文件"

 然后在具体使用时就像平时使用组件一样，如图。

 双向数据绑定（可以在父组件内改变子组件的内容）：

在子组件内输入以上内容@link......（string是文件格式）

注意：使用此项功能，子组件的内容要调成随childnum可变的，即图中Text（this.childnum）

在父组件内输入以上内容@state......（这次要赋值，即“222",也就是覆盖原来子组件的内容）

然后在child的（）内加一个{childnum:$fathernum}完成覆盖，如下。

三、if-else渲染（可以显示或隐藏组件）

把想使用此项功能的组件写入if中，如图

（此处的true是布尔型的，如果想隐藏，改为false）

四、for循环渲染（用来迭代数组）

先创建一个数组，如下：

在一个列表中引入并且输出这个数组，如下：

（toString指的是字符串类型）

五、以上内容全用到一起

创建子组件：先在MainAbility下创建一个目录，然后在这个文件夹下创建一个ARKts File，命名为child（子组件）

这个只用在上方有个@Component就行

在子组件内引入两个内容一个数字型，一个布尔型

 然后修改一下子组件文本具体内容，并且加入if渲染和按钮，如下

 再在按钮下引入事件

（++指的是加1，--指的是减1，this.childstatu=！this.childstatu指的是true转为false，即由显示到不显示）

引入父文件：

import{child}from"../common/child"//"../common/child指的是路径文件"

然后在父文件内引入两个参量，一个数字型，一个布尔型

再在具体内容中带入组件

可以调整column的内部组件距离（插入space）