整理零碎的Vue知识点

研究了好一阵子Vue,有些细小的知识点,慢慢的才理解过来,虽然零碎,但是也要系统的总结一下。

1. v-model :表单神器,这个就不说了,主要说这个指令还可以用在父子组件通信,是个语法糖,相当于引用了“input”事件,这样就不需要在父组件实例化中再定义方法了,子组件$emit()交互就可以驱动数据变化;

2. props: 接受父组件参数,并传递给子组件。如果直接应用在子组件上(不通过data返回),那么父组件数据更新,子组件也会跟着更新;然而Vue2.x设置单向数据流,子组件不能修改父组件传来的数据,所以只有你十分确定子组件不会修改父组件数据的时候,可以这么写,否则会报错。那么更保险的办法就是,用data返回一个新参数,子组件自己维护这个参数,数据交互,就交给watch来做,在watch中监听父组件参数值变化,将新的值传给子组件数据,这样子组件也可更新;而子组件修改自己的参数,也不会影响父组件,如果需要传给父组件,同样利用$emit即可;

3. $parent, $childern:用来访问父,子实例,注意是实例,换句话说,这两参数就相当于保存了父实例和子实例的所有内容,可以用一切合理的js方法访问和操作其中内容。这个是绕了我比较久的问题,之前一直和$emit,$on混淆,突然有一天瞬间就通了。然后很多事情就都理解了。不过这两个东西,根据Vue大神的建议,还是尽可能用在完全独立的组件上,业务中尽量少用。另外,如果需要遍历,组件中可以加上name属性,用于标识;

4. computed和methods: 都可以完成对数据的改变,区别是:计算属性会缓存,如果依赖的值没有变化,就不会重新计算,但是不能接受参数;方法没有缓存,只要有变化,都会重新计算一变,但是可以传参数。所以根据实际情况来确定使用哪种方式。

5. 使用$emit()和$on(),可以原生事件,也可以自定义,只要保证事件名称对应正确即可。

6. Vue需要多实践,实践出真知。

以上如有不妥,欢迎大神们指正,不胜感激!

猜你喜欢

转载自blog.csdn.net/qq_38047742/article/details/81976828
今日推荐