1、VUE组件间的传值方式
porps emits
解决问题:
常用父子组件传值方式,但也仅限于父子组件
存在问题:多级传递会存在强依赖,不方便维护
parent children
解决问题:
父子组件通讯方式,可以直接获取到父子组件对象VueComponent
存在问题:
1、父亲只有一个,但是儿子可能有多个
2、由于父子组件的生命周期不同步,子组件会优于父组件完成DOM更新,所以在父组件获取子组件DOM更新后的值需要用到$nextTick
attrs listeners
解决问题:
多级组件传递方法或属性,而中间级组件不用或少用其中属性值问题;
存在问题:
listeners里面的东西总会让使用者感到茫然,需要去最上级或者最下级查找;
provide/inject
解决问题:
多级组件传递值,需要在每个组件定义 props 或 $attrs问题
存在问题:
项目复杂情况下,由多个人完成,容易key重复
解决方案:
考虑symbol包裹key值
eventBus
解决不存在关系组件间的传值问题
存在问题:
过度依赖eventBus也会让接收代码的人感到困惑,且需要保证on完必须有off,对于点击类的事件发送,很容易因为没处理好off导致页面变卡甚至宕机
vuex
解决问题:
多个组件共用同一个数据
存在问题:
1、页面刷新后数据会丢失,需要借助sessionStorage和localStorage来存储数据;
2、应用VUE让程序耦合度提高,在其他项目想要搬运这个项目的组件时,往往需要因此做更多工作。因此,使用时需要考虑解耦