使用父组件作为中介_父组件定义数据和方法_它是一个空的Vue实例充当事件中心

一、使用父组件作为中介

同级组件间传值,最直接的方法就是通过它们的父组件来传递数据。这样做是因为Vue有一个单向数据流的特性,确保了数据流动的方向明确。

步骤:

  1. 父组件定义数据和方法:在父组件里定义共享的数据和相关的处理方法。
  2. 子组件通过props接收数据:子组件可以通过props属性来获取父组件传递的数据。
  3. 子组件通过事件向父组件发送数据:子组件在需要传数据时,可以触发一个事件告诉父组件,父组件处理完后再传给其他子组件。

以下是一个简单的示例代码:

父组件: