admin 管理员组

文章数量: 1087139


2024年4月13日发(作者:input是什么数据类型)

在 Vue3 中,可以使用组合式 API 来组织和管理 Vue 组件中的逻辑,包括父子组件之间

的数据传递。以下是一种基本的父子组件传值的方法:

1. 创建子组件:在子组件中定义需要从父组件传递下来的 props,例如:

Copy Code

// 子组件

2. 创建父组件:在父组件中引入子组件,并通过 props 将数据传递给子组件,例如:

Copy Code

// 父组件

在上述代码中,我们在子组件中使用了 watch 监听 props 变化,在父组件传递下来的

propMessage 数据发生变化时,会触发回调函数并更新子组件的 message 数据。在父组件

中,我们将 parentMessage 数据通过 props 传递给子组件,并在子组件中展示。

需要注意的是,Vue3 的组合式 API 中推荐使用 ref 来定义响应式数据,而不是 data。在

上述代码中,我们使用了 ref 来定义了 message 和 parentMessage 两个响应式数据。


本文标签: 组件 数据 父子 传递