在Vue中，有多种方式进行组件之间的通信。以下将介绍vue中的props、$emit、$on和$refs四种常见的通信方式。

1. 通过props进行父子组件通信。

<template>
  <ChildComponent :message="msg"></ChildComponent>
</template>
<script>
  import ChildComponent from './ChildComponent'
  export default {
    components: {
      ChildComponent
    },
    data() {
      return {
        msg: 'Hello Vue!'
      }
    }
  }
</script>


<template>
  <div>{{ message }}</div>
</template>
<script>
  export default {
    props: ['message']
  }
</script>

2. 通过$emit和$on进行父子组件通信。

<template>
  <ChildComponent @say-something="listenToChild"></ChildComponent>
</template>
<script>
  import ChildComponent from './ChildComponent'
  export default {
    components: {
      ChildComponent
    },
    methods:{
      listenToChild(msg){
        console.log(msg)
      }
    }
  }
</script>


<template>
  <button @click="$emit('say-something','Hello Vue!')">Say Something</button>
</template>
<script>
  export default {}
</script>

3. 通过$refs进行父子组件通信。

<template>
  <ChildComponent ref="child"></ChildComponent>
</template>
<script>
  import ChildComponent from './ChildComponent'
  export default {
    components: {
      ChildComponent
    },
    mounted(){
      this.$refs.child.sayHi()
    }
  }
</script>


<template>
  <div></div>
</template>
<script>
  export default {
    methods:{
      sayHi(){
        console.log('Hi Vue!')
      }
    }
  }
</script>

综上所述，Vue中的通信方式多种多样，开发者可根据需要进行选择。