常见错误总结

常见的踩坑总结：

1 JSON.parse（） 

使用函数时出现 “SyntaxError: Unexpected token o in JSON at position 1”的错误提示，这里一般是类型错误，JSON.parse要求传入的是字符串类型，如果传入的参数是对象，就会有这个错误信息

 

2 选出来的节点值是null：

这种错误原因一般有两个：

1 不存在该节点

2 有这个节点，但是还没有渲染出来

比如说，在created里面选择节点的时候往往出现这个错误，因为在这个生命周期中，DOM节点还没被渲染出来，所以选择出来的元素是空的

 

3 比较一下常用的选择节点方法

 

  1 用最原始的方式：

  document.getElementById()等原生的js函数

 缺点：用这个函数会全局搜索，效率较低

  2 通过this.$refs选择

     $refs是非响应式的，应当避免在模版或计算属性中使用

  3 通过this.$el来选择

     也是需要在元素渲染出来后才能使用这个方法来选择元素

4  [Vue warn]: Error in callback for watcher "function () { return this._data.$$state }": "Error: [vuex] Do not mutate vuex store state outside mutation handlers."

这个错误是在使用vuex的时候是在外面改变了state的值，而不是通过getters等

有时候要找引起这个错误的函数不是那么明显，因为在js中，对象的赋值是浅赋值，所以如果直接将vuex中的state里面的对象直接赋值给外面的对象，修改外面的对象时也会引起这个错误。当有这个需求的时候可以先将该对象用JSON.stringify()将state的对象改变为字符串，在使用JSON.parse（）方法转回来，这样就不再是浅赋值，在对外面的对象进行修改时就不会引起这个错误

5 假如有两个路由长这样：

{
  path: '/dashboard/home',
  component: DashboardHome
},
{
  path: '/dashboard/:dashboardId',
  component: DashboardDetail,
  props: true
},

那么应该把不带参数的路由写前面，带参数的路由写后面，否则会找不到正确的路由