ホームページ >ウェブフロントエンド >Vue.js >vue3 サブコンポーネント間の相互値転送の問題を解決する方法

vue3 サブコンポーネント間の相互値転送の問題を解決する方法

PHPz
PHPz転載
2023-05-17 20:19:041382ブラウズ

Vue3 サブコンポーネントは相互に値を渡します

1. サードパーティ ライブラリを参照します mitt

npm install mitt

2. プロジェクトの src フォルダーの下に utils フォルダーを作成し、 utils の mitt.js の場合、mitt.js のコードは次のとおりです:

import mitt from "mitt";
export default new mitt();

3. 例: コンポーネント A がコンポーネント B に値を渡す

//在组件A中引入
import mitt from "@/utils/mitt";

//调用传值
mitt.emit("mittClick", "数据数据数据");
//在组件B中引入
import mitt from "@/utils/mitt";

//接收传值
mitt.on("mittClick", (val) => {
    console.log(val)//数据数据数据
})

Vue 異なるコンポーネントが相互に値を渡す

空の Vue インスタンスを使用して値を渡します。$emit、$on を使用するだけです。

rree

以上がvue3 サブコンポーネント間の相互値転送の問題を解決する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はyisu.comで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。