vue组件通信
2021/8/9 23:37:07
本文主要是介绍vue组件通信,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
父子组件的通信
父组件通过props向子组件传递数据
子组件通过事件向父组件发送消息
父传子:
- 子组件在props中创建一个属性,用以接收父组件传过来的值
- 父组件中注册子组件
- 在子组件标签(在父组件文件中)中添加子组件props中创建的属性,也可以不添加直接用props里设置的默认值
- 把需要传给子组件的值赋给该属性
子传父(自定义事件):
-
在子组件中创建一个按钮,给按钮绑定一个点击事件
- 在响应该点击事件的函数中使用$emit来触发一个自定义事件,并传递一个参数
- 在父组件中的子标签中监听该自定义事件并添加一个响应该事件的处理方法
这篇关于vue组件通信的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-12-21Vue3教程:新手入门到实践应用
- 2024-12-21VueRouter4教程:从入门到实践
- 2024-12-20Vue3项目实战:从入门到上手
- 2024-12-20Vue3项目实战:新手入门教程
- 2024-12-20VueRouter4项目实战:新手入门教程
- 2024-12-20如何实现JDBC和jsp的关系?-icode9专业技术文章分享
- 2024-12-20Vue项目中实现TagsView标签栏导航的简单教程
- 2024-12-20Vue3入门教程:从零开始搭建你的第一个Vue3项目
- 2024-12-20从零开始学习vueRouter4:基础教程
- 2024-12-20Vuex4课程:新手入门到上手实战全攻略