vue中的总线及动画简述
总线机制解决非父子组件之间传值的问题(bus/总线/发布订阅模式/观察者模式)
Vue.prototype.bus = new Vue();
理解:
在vue的prototype上挂载了一个bus属性,当后续实例化的时候,vue实例就会有bus属性。
在子组件方法中,通过**this.bus.$emit(‘funName’, data);**向外触发
在子组件钩子函数mounted中通过bus进行监听接收。
this.bus.$on(‘funName’, function (data) {
console.log( data ) // 这里可以接受到$emit事件传过来的值
})。
动画
理解:
在元素节点或者子组件外层,包裹一个容器,它表示的是该容器内的操作有一个过渡的效果
原理:
过渡动画的原理:通过在某一时刻,自动的给元素增加删除class,以达到动画的效果。当动态组件加上外容器后,也会出现对应的效果。