vue页面排错思路及步骤

1. 先检查页面显示时依赖的数据示例cateList，此时检查数据cateList(使用 vue 调试工具查看当前组件的数据)
2. 如果该数据cateList不存在或者值为空，首先说明数据本身存在问题，先去排查数据在哪一步出现了问题
3. 找到给cateList赋值的地方，如果是赋值语句并没有执行,可能的原因是
   1. 当前获取数据的自定义函数没有得到正确的调用
   2. 接口调用出问题，此时检查发送请求的 url 地址、请求的方法、请求的参数是否符合接口文档的约定，如果符合文档约定，此时找后台沟通来确定问题所在
   3. 接口也是正常，那么问题可能出现在前端对数据的处理(比如后台返回的数据是一个扁平的结构，前端需要处理成嵌套的树形结构才能使用)和赋值上
   4. 前端代码中可能出现的错误类型
      1. SyntaxError：语法错误，代码不符合 js 语言规定的语法
      2. TypeError: 类型错误，说明当前使用数据的方式出错了，该数据没有所使用的方法或者属性
         TypeError: Cannot read property 'abc' of undefined 这是从一个值undefined的数据身上取abc属性报错
Cannot read property 'forEach' of undefined，这是从一个undefined数据身上使用forEach报错
TypeError: a.forEach is not a function 这是从一个非数组数据身上调用forEach方法报错
      3. RangeError: 数据越界超限，比如对一个数组赋一个负大小，或者操作 number 类型的数据超过 js 语言支持的最大数字
      4. EvalError: 执行 eval 语句时出错
      5. URIError: 对 url 地址进行编码解码时出错
4. 如果上面的步骤都没有问题，数据也对，但是页面效果还是不符合预期，此时检查 template 模板的语法和其他使用的数据变量名。如果其中涉及第三方的组件，检查第三方组件的使用(属性名及其赋值，方法调用)