vue3兄弟组件的传值

1、下载安装

npm install mitt -S

2、新建plugins/Bus.js

import mitt from "mitt";

export default mitt();

3、A组件

<template>
  <div>A</div>
  <button @click="btn">按钮</button>
</template>
<!-- 逻辑层：js -->
<script setup>
import mitt from "../plugins/Bus";
let str = ref("A数据");
const btn = () => {
  mitt.emit("fn", str);
};
</script>

4、B组件

<template>
  <div>B---{{ s }}</div>
</template>
  <!-- 逻辑层：js -->
  <script setup>
import { onBeforeMount } from "vue";
import mitt from "../plugins/Bus";
let s = ref("");
onBeforeMount(() => {
  mitt.on("fn", (e) => {
    console.log(e.value);
    s.value = e.value;
  });
});
</script>