Vue3 10多种组件通讯方法

开发者 · 2024-9-17 20:57:26

本文简介

点赞 + 关注 + 收藏 = 学会了

本文解说 Vue 3.2 组件多种通讯方式的根本用法，而且利用了单文件组件 <script setup> 。

众所周知，Vue.js 中一个很重要的知识点是组件通讯，不管是业务类的开发照旧组件库开发，都有各自的通讯方法。

本文恰当：

有 Vue 3 根本的读者。
筹划开发组件库的读者。

本文会涉及的知识点：

Props
emits
expose / ref
Non-Props
v-model
插槽 slot
provide / inject
总线 bus
getCurrentInstance
Vuex
Pinia
mitt.js

我会将上面摆列的知识点都写一个简单的 demo。本文的目标是让各人知道有这些方法可以用，所以并不会深挖每个知识点。
发起读者跟着本文敲一遍代码，然后根据本文给出的链接去深挖各个知识点。
收藏(学到)是自己的！

Props

父组件传值给子组件（简称：父传子）
Props 文档

父组件

Vue3 10多种组件通讯方法

所属分类: 问答交流

新帖推荐: 30日

推荐作品