一.List的组件 :
1.router:跳转组件,2.@Builder:自定义组件,3.循环需要:ForEach方法
数组需要的方法:
1.push方法:数组的增加
2.splice:数组的删除
二.登录页面代码展示与分析
1.准备数据:
首先要准备一些数据,用于登录账号将账号与密码存放在数组中,方便数据的存取,
acc和pwd两个变量用于输入框的值穿入这两个变量,用于判断用户输入是否正确。2.账号密码框:
placeholder:输入框提示词
我们通过输入框的onChange事件,可以把输入框的值传给上面声明好的变量中去
3.登录按钮:
登录按钮用于提醒我们的账号和密码是否一致,和是否输入。
router.pushUrl :登录组件
//写法:
router.pushUrl({
url:'pages/StuShowPage' //路径/想要跳转的页面
})
三.主页面代码展示与分析:
1.首先我们要创建任意来存放数组中,其次创建了多少数组则对应在声明相对应的变量用于添加数据
2.遍历数组并把数据显示到页面中
1.ForEach:用于循环遍历数组
2.List组件:列表包含一系列相同宽度的列表项,适合连续、多行呈现同类数据。
3.ListItem:List的子组件 设置List交叉轴方向宽度大于ListItem交叉轴宽度 * lanes时,ListItem在List交叉轴方向的布局方式。
3.数据添加模块
通过输入框值里的变化把输入的内容传到创建的变量中去,为点击按钮做为铺垫
4.添加按钮及代码分析
1.创建一个按钮,并添加点击事件判断添加内容是否为空,如果为空则提示数据不能为空。
2.如果内容不为空,遍历数组查看学号是否唯一,如果重复了,则提醒,没有重复则添加成功。
5.自定义组件
//自定义组件写法
@Builder 组件名称(){}
1.自定义删除组件![](https://i-blog.csdnimg.cn/direct/42a1180be2134d78983501715f4b4be5.png)
2.swipeAction:用于设置ListItem的左右划出的组件