vue 父子组件传 vue的标签

在Vue.js中，父子组件之间的数据传递通常是通过props和自定义事件来实现的。props允许你将数据从父组件传递到子组件，而自定义事件允许子组件向父组件发送信息。

1. 父组件向子组件传递数据：
父组件通过在子组件标签上添加属性的方式，将数据作为prop传递给子组件。子组件通过声明props来接收这些数据。例如：

   <!-- 父组件模板 -->
   <my-component :child-prop="parentData"></my-component>

   // 子组件选项
   export default {
     props: ['childProp'],
     // ...
   }

在这个例子中，`parentData` 是父组件的数据，它通过 `child-prop` 属性传递给 `my-component` 子组件。

2. 子组件向父组件传递数据：
子组件通过触发一个事件来向父组件发送信息。父组件通过监听这个事件来接收信息，并可以传递一个回调函数作为事件处理器。例如：

   <!-- 父组件模板 -->
   <my-component @child-event="handleChildEvent"></my-component>

   // 父组件选项
   export default {
     methods: {
       handleChildEvent(data) {
         // 处理从子组件传递来的数据
       }
     }
   }

   // 子组件选项
   export default {
     // ...
     methods: {
       sendToParent() {
         // 触发自定义事件，向父组件发送数据
         this.$emit('child-event', someData);
       }
     }
   }

在这个例子中，子组件通过调用 `this.$emit('child-event', someData)` 触发了一个名为 `child-event` 的自定义事件，并将 `someData` 数据传递给父组件。