作为一个优秀的前端工程师,我们应该掌握一些前端自测的点
前端自测
Table列表
是否使用公共组件
功能
列表加载时是否加loading
表单参数查询是否正常
排序是否正常
表头筛选是否正常
翻页是否正常
查询、筛选、排序操作后传入的分页参数是否正常
批量操作是否正常
删除或其他关键操作是否已提供二次确认框
样式
搜索表单控件间距是否正确
搜索表单按钮间距、图标是否正确
表头筛选、排序后高亮、图标是否正确
列宽分配是否合理
单元格内容展示形式是否合理
文本内容过长需使用超出隐藏+toolTips弹框
操作列按钮过多需要折叠
图文卡片列表
功能
翻页功能是否正确
样式
文字内容过多、过少时是否正确显示
图片不按约定尺寸上传时是否正确显示
图片列表无图片时是否正确显示
无数据时是否做兼容
文件上传
功能
文件类型是否限制
文件大小是否限制
文件数量是否限制
上传建议文案是否正确
删除功能是否正常
操作成功后提示语及动作是否正确
样式
文件预览样式是否正确
预览图片是否变形
不同颜色预览图片上删除按钮是否可见
文件名过长时样式是否正确
文件过多时样式是否正确
无数据时是否做兼容
弹框
是否使用公共组件
功能
表单弹框关闭后是否清除数据及校验结果
样式
按钮文案、顺序、间距是否正确
弹框类型、标题、图标是否正确
表单弹框表单项名称位置、间距是否正确
表单弹框必填项标识位置是否正确
表单
功能
表单字段是否正确
表单字段是否缺失
表单字段名是否与接口文档对应
已隐藏或删除的表单项是否已从提交数据中删除
表单校验是否正确
必填项需提供星号标识和提示
校验规则需和产品设计一致
输入项需考虑输入长度限制(与后端、产品协商)
联动表单项、动态表单项校验是否正确
校验提示语是否正确
校验提示语句格式需保持统一
表单回显是否正确
字段缺失时是否做兼容
后端返回数据类型不正确时是否做判断
下拉、级联、多选、单选、树回显数据是否正确
重复提交是否设限
表单弹框关闭后是否清除数据及校验结果
操作成功后动作是否正确
成功后是否需要清除数据
提示文字是否正确
页面跳转是否正确
修改列表数据时,操作完成后列表数据是否刷新
样式
表单项间距是否正确
表单项名称位置、间距是否正确
必填项标识位置是否正确
按钮文案、间距是否正确
Banner图片
功能
轮播切换时长是否正确
手动切换后,自动轮播是否正确
样式
图片是否正确展示
不按约定尺寸上传的图片需要做兼容
无数据时是否做兼容
全局切换
组织切换
项目切换
功能
切换下拉框内回显是否正确
切换后页面数据是否正常
应用切换后当前组织或项目是否正确
刷新后当前组织或项目是否正确
全局样式
正文、表单组件字号12px
PC网页1440屏幕内是否可正常展示
logo、用户头像是否展示正确