vue3 和 uniapp组件传值信息附加代码

Vue3 和 UniApp 都是现代前端开发框架，它们之间的组件通信机制有所不同。

在 Vue3 中，你可以通过 props、自定义事件（$emit/$on）、Vuex 或者响应式数据来传递信息。例如，父子组件间可以通过props进行单向数据流：

// 父组件
<template>
  <child-component :message="parentMessage" @changeParentMessage="handleChangeParentMessage"/>
</template>

<script>
import ChildComponent from './ChildComponent.vue';

export default {
  components: { ChildComponent },
  data() {
    return { parentMessage: 'Hello' };
  },
  methods: {
    handleChangeParentMessage(newMessage) {
      this.parentMessage = newMessage;
    }
  }
}
</script>

而在 UniApp 使用 WXML/WXSS 和 JavaScript 结合时，可以借助 `setData` 或者事件总线来传递数据：

<!-- 父组件.wxml -->
<view bindtap="handleTap">
  <child-view ref="childView" message="{{parentMessage}}" @updateMessage="handleUpdateMessage"></child-view>
</view>

<script>
Page({
  data: {
    parentMessage: 'Hello',
    eventBus: uni.createEventEmitter()
  },
  methods: {
    handleTap() {
      this.$refs.childView.updateMessage('New Message');
    },
    handleMessage(e) {
      this.setData({ parentMessage: e.detail.message });
    }
  }
})
</script>