关于Vue 兄弟组件通信

最近项目中遇到希望在操作路由组件里面内容的时候可以影响共用组件Header组件(这个其实就是他的兄弟组件)的操作。

 意思就是 router-view指向的router来影响Header组件的信息

首先需要的是在routr-view指向的组件(我这里用的是login组件，接下来就用login来说了)   添加$emit去向父组件传递参数并且触发父组件的自定义事件。

然后在父组件中添加自定义事件

自定义事件就可以去影响兄弟组件的传给它的子组件的props

 

绑定refurbish（props） 进入Header组件。

 在Header中接收props

并且在watch钩子函数中监听props的变化时候你需要的页面逻辑处理。

 

这次遇到的坑： this.$emit触发父亲传递数据的时候 因为我只是需要一个标示 所以我传入的是Boolen值 =====> .

               那么这会导致除了第一次操作意外。之后的所有操作都不会触发。因为true一直是没有变化的。所以这时候你就需要将boolean类型转化成引用类型 这样每次传入的数据都是有变化的 就会触发事件了。详细可以去了解基本类型和引用类型。