vue组件通信----子传父(超级详细)
发布日期:2022-03-15 19:30:48
浏览次数:12
分类:技术文章
本文共 658 字,大约阅读时间需要 2 分钟。
Vue传值
简单描述
父组件通过绑定自定义事件,接受子组件传递过来的参数
子组件通过$emit触发父组件上的自定义事件,发送参数
子传父具体实现步骤
- 父组件通过$on监听事件,事件处理函数的参数则为接收的数据
- 子组件通过$emit可以触发事件,
- 第一个参数为要触发的事件,第二个事件为要传递的数据
- sync修饰符:对一个 prop 进行双向绑定
自定义事件
子组件需要以某种方式,例如点击事件的方法来触发一个自定义事件
将所需要传递的值作为$emit的第二个参数,该值将作为实参传给响应自定义事件的方法 父组件 引入子组件–>注册子组件–>引用子组件 在子组件标签上绑定对自定事件的监听
总结
:在通信中,无论是子传父或父传子都是有中间介质。子传父的介质是自定义事件,父传子的介质是props中的属性。
代码演示
1.父组件parent代码如下:
父组件通过绑定自定义事件,接受子组件传递过来的参数
{ { msg }}
父组件接手到的内容:{
{ username }}
2.子组件son代码如下:
子组件通过$emit触发父组件上的自定义事件,发送参数
{
{ sonMsg }}子组件接收到内容:{
{ psMsg }}
转载地址:https://blog.csdn.net/weixin_58102387/article/details/122850138 如侵犯您的版权,请留言回复原文章的地址,我们会给您删除此文章,给您带来不便请您谅解!
发表评论
最新留言
留言是一种美德,欢迎回访!
[***.207.175.100]2024年04月14日 03时43分10秒
关于作者
喝酒易醉,品茶养心,人生如梦,品茶悟道,何以解忧?唯有杜康!
-- 愿君每日到此一游!
推荐文章
Unity iOS接SDK,定制UnityAppController
2019-04-27
Unity iOS接SDK前先要了解的知识(Objective-C)
2019-04-27
记一次iOS闪退问题的定位:NSLog闪退
2019-04-27
Unity打开照相机与打开本地相册然后在Unity中显示照片(Android与iOS)
2019-04-27
无需接入SDK即可在Unity中获取经纬度(Android/iOS),告诉我你的坐标
2019-04-27
Unity获取系统信息SystemInfo(CPU、显卡、操作系统等信息)
2019-04-27
Unity中获取物体的尺寸(size)的三种方法
2019-04-27
Unity中的关节组件和绳子效果的实现
2019-04-27
Unity可视化编程插件: Bolt,可以像UE4的蓝图那样啦
2019-04-27
Android的.dex、.odex与.oat文件扫盲
2019-04-27
Unity移动应用如何在Bugly上查看崩溃堆栈
2019-04-27
unity3D 在屏幕边框创建碰撞框
2019-04-27
xml中常用的转义符
2019-04-27
关于MSDK的几个难点
2019-04-27
使用UnityEditor做工具
2019-04-27
Visual Studio我常用的快捷键
2019-04-27
写C# dll供Unity调用
2019-04-27
Linux制作run安装包
2019-04-27