vue3组件通信（传值、传方法）总结

一、常用方法汇总

  1. 父->子：

• props
• provide/jnject
• vuex     

  2. 子->父：

• emit
• vuex(nextTick)

  3. 祖->孙：

• provide/inject
• vuex
• props多层传递

  4. 孙->祖：

• vuex(nextTick)
• emit多层传递

  5. 兄弟组件：

• vuex
• 通过共同的父组件传递

  6. 父使用子的值、方法：

• ref   ($children已删除)
• 子->父

  7. 子使用父的值、方法：

• $parent   (vue2方式：this.$parent, vue3方式：getCurrentInstance().ctx.$parent)
• 父->子

二、注意事项

　　 1. 可以使用 v-if、watch、computed使子组件重新渲染

　　 2. 父子组件生命周期：

　　　　父-created
　　　　子-created
　　　　子-mounted
　　　　父-mounted
　　　　父-onBeforeUnmount
　　　　子-onBeforeUnmount
　　　　子-onUnmounted
　　　　父-onUnmounted

       3. eventBus：官方不建议使用，vue3不能使用原生的，只能用mitt等外部库代替