uniapp子组件传父组件

UniApp中的子组件向父组件传递数据通常通过事件总线或者props属性进行。以下是两种常见的方式：

1. **通过props（属性）**：
- 父组件可以定义一个prop，然后在子组件中设置该值并emit一个自定义事件（比如`$emit('update:parentProp', newValue)`），当子组件需要更新父组件的数据时就触发这个事件。

   // 子组件
   export default {
     props: {
       parentProp: {
         type: String,
         default: ''
       }
     },
     methods: {
       sendData() {
         this.$emit('update:parentProp', '新值');
       }
     }
   }

   // 父组件
   <template>
     <child-component :parentProp="childValue" @update:parentProp="handleUpdate"></child-component>
   </template>
   <script>
   import ChildComponent from '@/components/Child.vue';
   export default {
     data() {
       return { childValue: '' };
     },
     methods: {
       handleUpdate(newValue) {
         this.childValue = newValue;
       }
     }
   }
   </script>

2. **通过EventHub（事件总线）**：
如果父子组件不在同一个页面或者有更复杂的通信需求，可以使用Vue的内置EventHub来实现实时通信。先在父组件创建一个EventHub实例，然后在子组件中发出事件，在父组件监听事件处理更新。

   // EventBus.js (单例)
   import Vue from 'vue';
   const eventHub = new Vue();

   // 父组件
   created() {
     eventHub.$on('messageFromChild', this.handleMessage);
   },
   beforeDestroy() {
     eventHub.$off('messageFromChild', this.handleMessage);
   },
   methods: {
     handleMessage(data) {
       console.log('接收到来自子组件的消息:', data);
     }
   }

   // 子组件
   methods: {
     sendMessage() {
       eventHub.$emit('messageFromChild', '这是来自子组件的消息');
     }
   }