vue实现父组件与子组件传参

问题：vue中，我有一个父组件A，有三个子组件B、C、D，其中B组件是select选项框，B组件选择了了产品类型，则C根据产品类型获取表单数据，然后把C中表单数据中的商品名传给D组件，如何实现

要实现这个功能，你可以按照以下步骤进行操作：

1. 在父组件 A 中，创建一个名为 selectedProductType 的数据属性，用于保存选中的产品类型。

2. 在子组件 B 中，创建一个 select 选项框，并绑定一个 v-model 到父组件 A 的 selectedProductType 属性上，以便获取选中的产品类型。

3. 在子组件 C 中，创建一个名为 formData 的数据属性，用于保存表单数据。在组件的 mounted 钩子函数中，监听 selectedProductType 的变化，当产品类型发生变化时，根据产品类型获取相应的表单数据，并将数据保存到 formData 中。

4. 在子组件 C 中，使用 Vue 的事件机制，创建一个自定义事件（例如 form-data-updated），并在获取到表单数据后，通过 $emit 方法触发该事件，并将 formData 作为参数传递。

5. 在父组件 A 中，通过在子组件 C 上监听 form-data-updated 事件，并在事件处理函数中获取到传递的表单数据。将表单数据中的商品名传递给子组件 D。

6. 在子组件 D 中，接收父组件传递的商品名，并进行相应的处理。

下面是一个简单的示例代码，用于说明如何实现上述功能：

<!-- 父组件 A -->
<template>
  <div>
    <B v-model="selectedProductType"></B>
    <C @form-data-updated="handleFormDataUpdated"></C>
    <D :productName="productName"></D>