vue子父类传值

最新推荐文章于 2025-06-17 10:37:35 发布

原创最新推荐文章于 2025-06-17 10:37:35 发布 · 2.1k 阅读

CC 4.0 BY-SA版权

文章标签：

19 篇文章

订阅专栏

本文详细介绍了Vue.js中父子组件间的数据传递方法。包括父组件如何通过props向子组件传递数据，以及子组件如何通过$emit触发自定义事件，将数据回传给父组件。文章通过具体示例解释了这一过程，帮助开发者更好地理解和应用组件通信。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

子组件(接收方)在vue对象中，通过props属性声明，声明他期待获得的数据
- props:[“commentId”],
父组件(发送方)注册子组件，在使用子组件的时候，以键值对的方式传递给子组件，
- :commentId=“commentId”
- 然后再data里面定义commentId的值，

子组件(发送方)以某种方式触发一个自定义事件，在事件中通过
- $emit(“listToChild”,this.value)
父组件(接收方)在引用子组件标签中监听该自定义事件，并添加一个响应该事件的方法
- v-on:listToChild=“showMsgFun”
- 在方法中调用此方法 showMsgFun(val){ console.log(val); }