学生管理系统项目总结

一·、项目需求

• 1页面渲染
•         。高度还原UI效果图
•         。页面数据全部是数据驱动
•         。刷新页面后列表中新增的学生数据不会丢失
• 2、删除功能
•         。删除操作增加二次弹框确认，确认后删除当前行的学生信息
• 3、表单功能
•         。对表单字段做非空校验和格式校验(提升用户体验，减轻服务端压力)，校验不通过不允许添加。点击添加按钮会往列表中添加新增的学生信息，同时表单数据清空
•         。点击重置按钮清空表单中所填写的学生信息
• 4、列表功能
•         。点击编辑按钮，当前行学生数据切换成可修改的输入框并同步显示该学生信息(行内编辑)，编辑按钮变为确定按钮，点击确认按钮会修改该学生数据，当前行字段切换成文本显示

二、实现思路:

• 1、第一步:分析学生管理系统表单和表格中涉及的数据类型和结构，在is中书写好要使用的数据
• 2、第二步:通过数据驱动的思想书写学生表单静态页面，点击添加按钮保证能获取最新的表单数据
• 3、第三步:通过数据驱动的思想书写学生列表静态页面，渲染列表数据
• 4、第四步:点击添加按钮后把学生表单数据添加到列表数据中，渲染视图
• 5、第五步:因为要实现行内编辑，所以需要一个判断是否是编辑态的状态数据，所以给列表每一行数据添加一个状态字段isEdit为true就是输入框(编辑态)，为false就是染文本，在列表染中手动根据isEdit判断为true显示输入框，为false显示文本，同时编辑按钮也要做相应判断
• 6、第六步:删除功能增加弹框二次确认
• 7、第七步:实现页面刷新数据不会丢失的功能
• 注意:表