Vue使用问题记录(持续更新…)

1、数组非响应式

• 直接修改数组的长度 比如 this.list.lenght = 10;

• 利用索引直接设置数组的某一项 比如 this.list[2]= {aa:‘aa’}

通过以上两种方式修改，页面视图无法刷新。
 
原因猜测：

    vue源码，通过Object.defineProperty()对对象属性的读和写分别使用get()和set()进行拦截，每当该属性进行读或写操作的时候就会触发get()和set()，使得一个对象转化成可观测对象。而数组通过将拦截挂载到数组实例与Array.prototype之间，这样通过数组原生方法操作数据，就能侦测到变化。 这里通过array.length = 0修改, 而不是通过数组原生方法修改，所以侦测不到。

解决方案：

1、通过数组原生方法splice，可以实现增删改查 。(如：splice、 push 、pop、shirt、unshirt…)
2、通过Vue内部Vue.set() 实现响应式。

2、 路由守卫无法获取到this实例

• 在beforeRouteEnter时，页面还没有渲染，无法获取this实例。

• 报错：

• 解决方案：
      通过next回调来访问实例。确认导航后，将调用回调，并将组件实例作为参数传递给回调：
  
  注意：beforeRouteEnter调用在mounted之前，next 回调在mounted之后