vue 几个典型的坑

1、编辑某一处，另一不相关的元素受到影响。

比如：一个列表需要被编辑。

每一行都有一个input，如果修改某一行的input，会影响其它某行的input，这时候可能的原因是: 循环的 key 设置的有问题，可能key重复了。

 

2、input不能foucs。

比如：有一个input框设置了 autofocus但是有时候不能实现自动 focus的效果，这可能是focus的tick不对。

斛决方法是对input设置一个 ref="inputTarget"，然后在需要foucs的时候调用 this.$nextTick(() => { this.$refs['inputTarget'].focus() })这样手动指定一下就好了

 

3、数组内的数据修改之后，页面上对应的元素没有更新。这块是vue考虑到性能问题没有监听数组内的数据。

解决方法是用 this.$set(this.arrayData, index, item); 用 $set设置就可以了。

 

4、如何在vuex中获取vue的实例： this._vm就是vue的实例

 

5、父组件获取的数据在子数组不及时更新。

可能的原因是：父组件是异步获取数据，子组件在异步获取数据之前已经渲染了，所以子组件拿到的第一手数据不是异步获取的。