bug的分类

bug的分类

语法上的问题：
在循环的时候，
1.一定要注意这个循环的对象是否是空对象；空对象就不需要进行循环了，
判断一下，空对象就不需要进行循环了；

2.在XXX.a属性的时候，要注意这个对象是否有这个key; 
可以是用关键字in; 
'key' in boj  有这个字段就是true,
没有这个字段就是false 

(3) 对以显示的内容；都应该考虑内容过长怎么处理这个问题；
通过的解决办法是超出 显示省略号

(4) 在弹框添加内容后；清除数据; 不要让数据有引用值；

(5) 限制用户的输入；用户输入太长了，可能报错；

(6) 文件上传时，应该检查上传文件的格式是否正确；以及验证文件的大小；
    文件格式检查办法
    var fileName =params.file.name;
    var fileArr = fileName.split('.');//将字符串转化为数组；
    var fileType=fileArr[fileArr.length-1];//获取数组最后一个就是文件的格式类型

(7) 时时注意自己的代码有没有异步操作，应为异步可能会发生意想不到的情况；
    比如下面这个就是异步造成的bug;写代码时，随时注意这样做会不会产生异步
    imsendStart(item){
//教室所需要的的参数
var treeArr_params=[];
// 查询教室参数
let treeidParams={
    id:item.id
}
this.$api.sever(treeidParams).then(res=>{
    if(res.success==true&&res.data){
    treeArr_params= res.data.map(v=>v.classroomId);
    }else{
    treeArr_params=[];
    }
})
let params={
    classroomId:treeArr_params, //这里可能拿不到值，因为这里可能会产生异步这样的情况
}
this.$api.immediatelyStart(params).then(res=>{
    
})
},

  （8）视图没有跟新的情况
   // 渲染接口
            postTestRenderTestListApi(){
                this.$api.postTestRenderTestList().then(res=>{
                    if(res.success==true){
                        if(res.data&&res.data.length>0){
                             this.schoolTestList=res.data；//赋值语句 是有问题的；如果只有一条数据，这条数据被删除后；就不会走到if语句体里面；
			     //就会出现视图未跟新这样的情况；在else中处理一下				         
                        }else{
                            this.currentOrder=-1;
                            this.$emit('nodatahander')
                        }
                    }else{
                        //因为没有数据他返回的是false
                        this.schoolTestList={};
                    }
                })
            },

 细节：	
   (1) 在上传文件的过程中，应该有提示语；表示文件正在上传中；

操作上的问题
(1)  在表格中删除数据时，第1页页以后的数据，在删除的时候，将页码重置为1;
     然后在调用更新接口，如果第二页有一条数据，那么删除后，可能会出现没有数据这种情况；
     因为此时页码是2，所以没有数据了；

(2)  在小程序中，下拉刷新 上拉刷新 的时候，注意数据是否有堆叠这种情况；

(3)
很多时候，我们都需要存储用户点击的值，
那么什么时候应该存储用户的值
就显得非常的重要了，
我有些时候喜欢在用户点击的时候，
就把值给存储起来了；
其实这是非常的不专业的；
并不是用户点击了就处理了值；
应该是用户点击了确认按钮，你才应该存储值

后面在写今天只想到这么多了    
今天又增加了一些，希望自己每天都可以进步；

文件上传的注意点

1==》在进行文件上传的时候，需要限制文件的类型。
2==》是否限制文件的大小
3==》上传成功后，需要将文件对象清空。
4==》上传的时候时候需要提示正在上传中
5==》按钮一定不可以多次连续点击
6==》当用户上传的时候，将按钮设置为loadIng中，除非成功或者失败才可以重置。

表格分页的注意点

1==》 
注意表格某一页的数据只有一条数据。
在删除的时候，需要将页码重置为1

2==》
在表格进行条件查询的时候。
一定要将页码重置为1

3==》表格中，在进行数据勾选的时候；
无论是批量删除还是单个删除
操作完后，都应该将勾选值重置为【】

多次连续点击一定会有bug产生，所以需要注意一下

一定要考虑最初初始状态

在我们写完页面对完接口之后。
一定要喊后端将数据清空，走一次初始状态。
否者在项目上线的初始状态。
一定会有千奇百怪的问题

一定要if之后的else

我们都知道if和else
我们在使用的使用
一定要考虑else这种情况会怎么样哈
比如说：成功后的if中你赋值了
else失败的情况是不是你要将值清空
严格的来说：
如果if中的语句是赋值语句
那么else中的语句就是清空语句
这个你一定要注意哈

内容太多如何做处理

我们一定要考录内容太多的处理方式哈
比如说：
上传的文件名很长
数据太多
选择框中的数据太多应该怎么处理
总之就是数据太多应该怎么去处理

隐式转换的注意点

我们都知道 数字 0 null  undefined  ' '  " "
这几个进行隐私转换的时候等于false
然后有意思的是事情就发生了
在进行数量展示的的时候
if(item.num){
  this.money=item.num
}else{
this.money=''
}
后端返回来的item.num=0
然后我就翻车了
这个要注意一下哈
看一下是否是数字类型的
数字类型的判断需要注意

一定要注意数据值少了怎么样

比如echarts的柱状图，正常情况是7个柱状图。
在特殊情况下，可能有只有2个柱状图
这样的情况会不会出问题呢
很显然我出问题了

使用JSON.stringify的value=undefined会出问题的

let signInfo = [
  {
    fieldId: 539,
    value: undefined
  },
  {
    fieldId: 540,
    value: undefined
  },
  {
    fieldId: 546,
    value: undefined
  },
]

// 判断到value为undefined，返回空字符串即可
JSON.stringify(signInfo, (key, value) => typeof value === 'undefined' ? '' : value)
// '[{"fieldId":539,"value":""},{"fieldId":540,"value":""},{"fieldId":546,"value":""}]'
链接：https://juejin.cn/post/7017588385615200270

这样情况很有可能会出现在表单搜集数据
有人已经翻过车了

表单类型的bug

表单数据什么都没有填写，直接点击提交按钮是否会报错？
结果按钮加了一个转圈圈，导致后面第二次压根就无法添加了。
尴尬不嘛？

所以我们可以延伸:表单类型的bug
<1> 数据为空，直接点击提交按钮。
<2> 数据只写了必须输入的字段，直接提交
<3> 数据只写了非必须输入的，直接提交
<4> 提交失败，按钮是否可以再次重复提交
<5> 第一次正确提交后，你是否把值清空了，特别是引用类型的值。
<6> 表单(输入类型)一定限制字数或者内容

关于表格删除的bug

<1> 单条数据删除时，如果某一页只有一条数据，删除后出现无数据咋个办？
<2> 在批量勾选删除时，同样出现某一个把全部数据删除了，出现无数据咋个办？
<3> 批量删除后，是否把勾选的值清空

关于运算符的bug

只要含有小数的四则运算，你就一定要考虑精度丢失这样的问题

关于循环的bug

在循环的时候,你一定要考虑某一个字段为空这样的情况
在获取某个值的时候，要考虑是否是空状态
否则会造成页面假死这样的情况。你一定要注意哈

你最常见的bug

1.表单没有去限制长度
2.展示表单的地方没有考虑内容太多如何处理
3.字体的颜色，大小，间距，没有注意到
要注意界面上的显示值与你传递的参数是否保持一致
要注意界面上的显示值与你传递的参数是否保持一致
要注意界面上的显示值与你传递的参数是否保持一致
重要的事情说三次

样式bug

屏幕变小后，会不会影响你的界面。其实不应该影响页面布局的。
因为用户可能是屏幕分辨率比较低的笔记本。写好页面后，应该缩小页面，观察是否影响界面
这次已经提出了一个bug  22.11.29

性能方面的bug

像表格，列表。如果后端没有分页的话。你应该考虑一下数据如果达到上千条数据后
页面会非常的卡顿。(数据只要达到3000条左右的时候，就会非常的的卡顿)
解决办法：1.喊后端分页处理     2.前端分页处理或者做虚拟滚动
到不然肯定会有性能方面的bug

echarts的折线图的bug

 echarts的折线图：当x轴数据特别多。此时X轴会自动省略掉其中的一些轴。这是echars的一个特点
 此时可能会出现X轴最后一个刻度无法显示。【只要数据量大，就一定会出现的】
 解决办法:设置showMaxLabel: true,后虽然可以显示X轴最后一个刻度.
 但是也有可能是最后一个刻度无法显示完全。
 还需要配置grid: {left: '3%',right: '4%', bottom: '3%',containLabel: true }来处理