【VUE】vue组件之间通信有几种方式

vue组件之间通信可分为以下几种

• props和$emit(也就是常说的父子组件通信，常用)
• $attrs和$listeners
• 中央事件总线（非父子组件间通信）
• v-model
• provide和inject
• $parent和$children
• vuex

 1.props和$emit(常用)

Vue.component('child',{
    data(){
      return {
        mymessage:this.message
      }
    },
    template:`
      

         
    `,
    props:['message'],//设置props属性值，得到父组件传递过来的数据
    methods:{
      passData(val){
        //触发父组件中的事件，向父组件传值
        this.$emit('getChildData',val)
      }
    }
  })
  Vue.component('parent',{
    template:`
      

        
this is parent compoent!
        
      
    `,
    data(){
      return {
        message:'hello'
      }
    },
    methods:{
      //执行子