使用bus实现父子兄弟跨级间传值

背景：在项目中，几个组件实现自由收缩，组件间收缩高度相互影响，例如：


使用bus可以直接在bus.js中创建vue实例，在main.js中引入就可以使用了

在这里我是仿效vuex插件那样制造bus插件来使用的：

const install =(Vue) => {
  const Bus = new Vue({
  	data(){},
  	created(){},
  	methods:{},
   })
  Vue.prototype.$bus = Bus
}
export default install

在main.js中引用：

import VueBus from './vue-bus';
Vue.use(VueBus)

要求：a、b组件任意一个伸展或者收缩，里外一个也随之改变：
bus.js的created中：

 this.$on('isShow',(val) =>{
        this.isShow = val;
      });

在data中设置默认值，默认组件初始状态为收缩：

isShow: false

在a、b组件中：改变bus.js中的isShow值

methods：{
	switchState(){
          let isShow1 = this.isShow;
          isShow1 = !isShow1 ;
          this.$bus.$emit('isShow',isShow1);
    },
},
computed: {
    isShow() {
          return this.$bus.isShow
    }
}

收缩舒展的样式问题：根据三元表达式判断isShow是否为真值添加样式，这里代码我就不粘贴了