vue 多组件传值技巧

vue组件之间通信，我们可以使用props || emit和vuex两种方式，但是vuex太重，props在多级组件中使用又太麻烦，子子子子子 这种多层组件向上触发事件很容易出BUG
so v-on="$listeners" 可以解决每层都要emit事件和参数！

eg:

<top>
 <parent>
   <center>
     <bottom>
     </bottom>
    </center>
  </parent>
</top>

bottom

 <div @click="changeEmit">
 </div>
 changeEmit(){
 	this.$emit('changeName',123456)
 }

center

<bottom v-on="$listeners">
</bottom>

parent

  <center v-on="$listeners"> </center>

top

<parent @changeName='changeName'></parent>

changeName(e){
	// e : 123456
}

如果top组件要和bottom组件进行通信，下面有三种方式可以实现

v-on=“$listeners"在最里层组件和最外层组件不用写最里层写触发的事件emit和参数，中加两层组件加上v-on="$listeners” 不用再接收和触发事件，
最外层 直接接收 触发的事件和参数就可以。