vue3组件常用的通信方式

Vue3中的父子组件通信与pinia库：defineProps详解,

原创已于 2024-02-27 21:12:09 修改 · 473 阅读

9 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #前端 #javascript

于 2024-02-27 21:11:41 首次发布

本文介绍了Vue3中使用`defineProps`进行父子组件间props传递的方法，强调了其只读响应式特性，以及如何通过子组件向父组件传递数据。同时提到了pinia库在页面管理中的应用。

1.父传子

父组件:

子组件:

defineProps是什么呢？

它其实就是一个API函数。defineProps 是 Vue 3 中的一个函数，用于定义组件的 props。与 Vue 2 中的 props 配置选项不同，使用 defineProps 函数定义的 props 是只读的响应式对象，它们的值由父组件传递而来，不能被子组件修改。这有助于提高组件的可维护性和可重用性，并减少不必要的副作用。 简单理解：就是用于拿父组件传过来的值！