前端常见问题点整理

分类	常见问题	处理方案
按钮类	快速点击，造成数据重复提交	增加 loading，防止重复点击
按钮类	禁用按钮点击时只是样式禁用，仍可点击	使用 disabled 属性禁用 1、重要业务增加 flag 2、建议后端增加防止重复提交
兼容类	低版本手机不支持 css3 语法 position: fixed; left 和 top 值	添加适配内核如：–webkit
兼容类	低版本手机不支持 ES6 语法	ES6 语法使用时注意是否使用 babel 转换
兼容类	部分手机不识别 font-weight: 500/600 (小米)	换成 font-weight: bold
倒计时	倒计时结束不刷新数据	增加刷新
倒计时	倒计时结束前后端刷新数据频率不一致导致前端频繁刷新（频繁刷新多次后，数据正常显示）	倒计时结束后延迟刷新
倒计时	在页面切换或者变化时未重置数据	在页面切换或者变化时重置倒计时以及相关状态
文案展示类	值为数值类型 0，显示默认值([*/–])	值为 0 特殊判断，根据具体业务需求展示
数值计算	当数值在进行减法或除法计算时，出现浮点数	toFixed
样式类	移动端 line-height 不居中	line-height: normal; display: flex; align-item: center;
样式类	移动端元素固定定位时，内部元素动态控制展示，在页面滚动时部分手机出现元素错位（元素跟随屏幕滚动）	先将元素隐藏，内部元素动态判断加载出来之后在将固定定位元素展示出来
表单类	表单未添加校验（如：必填，正则等）	在一次开发写表单的时候顺手添加表单校验
表单类	输入框输入过长	输入框添加长度限制
图片	图片过大	图片在蓝湖/Figma 上下载后使用 TinyPNG 对图片进行二次压缩
图片	当页面图片过多时导致页面卡顿	图片懒加载、将图片换成背景图加载
分页加载	连续点击导致加载数据异常问题，连续点击时，点击加载按钮状态还没变成加载中的时再次触发	在接口请求中添加 loading 阻止请求
分页加载	有多个 tab 切换时，分页数据异步返回导致数据错乱	在接口返回中添加是否是当前数据判断
活动类异常情况	全部活动状态判断	考虑全部活动状态（有时候产品并不考虑全部），例如活动未开始时的异常情况
活动类异常情况	活动默认展示【活动已结束】	在接口请求数据回来之前展示 loading
时间格式化	处理后台返回时间戳	时间轴数据比当前月小一个月 getUTCMonth() 方法可返回一个表示月份的数字（按照世界时 UTC）。（一月份为 0, 二月份为 1, 以此类推）