vue的坑

1. (vue2.x以上,1.x没有问题)vue和jq一起使用的冲突:在使用了v-bind: class的元素上,当vue和jq都需要增改class时,用jq加的属性可能无效。

原因:当数据的布尔值改变后(比如某个class需要加上),由于vue是在本次事件轮结束后更新DOM或改变属性,而jq的addClass是同步的,所以jq加上的类名会被vue覆盖。

解决方案:将jq的addClass写在Vue的nextTick里

2. 局部的components和路由的component分开放,路由的放在视图view文件夹里

3. v-show 只是在绑定值为false时加上display:none 在true时移出,而不会加上display:block 所以如果单独在css里写了display:none 即使这个元素v-show为true也是显示不出来的

4.vue做侧栏导航,用锚点实现,点击时切换active样式,当active = index直接写在模板的@click中时,导致锚点出bug,换成this.active = index 或者换成在method里写就没问题。(???不明原因)

5. 当路由切换时,vue组件及对应的数据会被就地销毁,*注意:如果vm的data里引用的是一个对象,而这个对象定义在vue的option对象外,将会形成闭包,将这个数据对象缓存起来,即使切换到别的页面,当再切换回来时,vue再次加载组件,还可以引用之前的数据对象(保留之前的所有状态)

eg.

//闭包中的data,即使vue实例被销毁它也不会消失

var data = {.....}

//vue option对象

export default {

  data() {

  return {

    data: data

    }

  }

}

一般来说,这样是弊大于利,虽然利于保存一些状态,但增加了污染的可能性。尤其是当页面中复用了好几个组件时,data将是共享状态的,容易出问题。

原文地址:https://www.cnblogs.com/natsu07/p/7677885.html