vue $emit子组件传出多个参数,如何在父组件中在接收所有参数的同时添加自定义参数
前言
很多时候用$emit携带参数传出事件,并且又需要在父组件中使用自定义参数时,这时我们就无法接受到子组件传出的参数了。
找到了两种方法可以同时添加自定义参数的方法。
方法一
子组件传出单个参数时:
// 子组件
this.$emit('test',this.param)
// 父组件
@test='test($event,userDefined)'
方法二
子组件传出多个参数时:
// 子组件
this.$emit('test',this.param1,this.param2, this.param3)
// 父组件 arguments 是以数组的形式传入
@test='test(arguments,userDefined)'
参考文献
https://github.com/vuejs/vue/...
原文地址:https://segmentfault.com/a/1190000016726750
vue $emit子组件传出多个参数,如何在父组件中在接收所有参数的同时添加自定义参数的更多相关文章
- vue组件之间的通信以及如何在父组件中调用子组件的方法和属性
在Vue中组件实例之间的作用域是孤立的,以为不能直接在子组件上引用父组件的数据,同时父组件也不能直接使用子组件的数据 一.父组件利用props往子组件传输数据 父组件: <div> < ...
- Vue 父组件向子组件传值,传方法,传父组件整体
父子组件传值 1.父组件调用子组件时绑定属性,例如-> :title="title" 2.子组件中在props中声明title:props:['title','msg'] 3 ...
- SpringMVC中控制器接收JSP页面表单的参数接收方式详解及细节注意(400错误)
控制器方法中参数的接收 (1)以前的参数接收: String param = req.getParameter(name): (2)SpringMVC简化这个操作,只需要给控制器方法添加参数即可 a ...
- SpringMVC中@RequestBody接收前端传来的多个参数
在使用ajax发送请求时,如果发送的JSON数据是一个类中的不同属性,在Controller方法中使用@RequestBody会直接封装进该类中 例如: 前端部分代码 JavaScript <s ...
- $emit子组件传出多个参数,如何在父组件中在接收所有参数的同时添加自定义参数
很多时候用$emit携带参数传出事件,并且又需要在父组件中使用自定义参数时,这时我们就无法接受到子组件传出的参数了. 找到了两种方法可以同时添加自定义参数的方法. 方法一:子组件传出单个参数时 ...
- vue子组件向父组件传递参数的基本方式
子组件: this.$emit('transferUrl', this.picUrl) 父组件: 引入子组件<pics @transferUrl="gettransferUrl&quo ...
- 子组件通过 $emit 触发父组件的自定义事件
子组件: <template> <div class="train-city"> <h3>父组件传给子组件的toCity:{{sendData} ...
- vue.js事件传值之子组件传向父组件以及$emit的使用
在项目开发中,有时候会遇到一种需求比如是:在子组件中,通过一个事件,比如点击事件,去改变父组件中的某个值,下面来看看是怎么个流程 还是先截图目录结构 父组件为app.vue,components中的文 ...
- Vue 子组件向父组件传参
直接上代码 <body> <div id="counter-event-example"> <p>{{ total }}</p> & ...
随机推荐
- 双系统安装Linux的步骤以及一些误区
1.一次安装失败引发的思考 笔者安装双系统(Windows 7+ Ubuntu 16.01)时参考了如何安装win10和linux [ubuntu14]双系统这篇百度经验,却发现安装后并没有如期进入U ...
- 微信小程序实战
为了积攒粉丝,公司决定做一个一分钱姓名测算的小程序引导大家关注公众号. 实现的需求就是 1 首页 用户编辑姓名和性别进行提交 2 测算结果页 实现分享和支付功能 3 测算历史页面 看到用户曾经测算记 ...
- Jmeter将JDBC Request查询结果作为下一个接口参数方法
现在有一个需求,从数据库tieba_info表查出rank小于某个值的username和count(*),然后把所有查出来的username和count(*)作为参数值,用于下一个接口. tieba_ ...
- c++11 thread的学习
http://www.cnblogs.com/wxquare/p/6736202.html 还没开始 留个链接 使用c++11 thread支持实现 一个生产者消费者模型 下面是一个生产者消费者问题 ...
- 060 Permutation Sequence 排列序列
给出集合 [1,2,3,…,n],其所有元素共有 n! 种排列.按大小顺序列出所有排列情况,并一一标记,可得到如下序列 (例如, n = 3): 1."123" 2. & ...
- HDU 1027 G - Can you answer these queries?
http://acm.hdu.edu.cn/showproblem.php?pid=4027 Can you answer these queries? Time Limit: 4000/2000 M ...
- (转)Linux命令之Ethtool用法详解
Linux命令之Ethtool用法详解 原文:http://www.linuxidc.com/Linux/2012-01/52669.htm Linux/Unix命令之Ethtool描述:Ethtoo ...
- Unity Log重新定向
Unity Log重新定向 使用Unity的Log的时候有时候需要封装一下Debug.Log(message),可以屏蔽Log或者把log内容写到文本中.通过把文本内容传送到服务器中,查找bug出现的 ...
- c# 视频播放
发表于: 2003-10-15 20:39:21 搞定了,嘿嘿!首先非常感谢zoujiaming在邮件中给我指了条路:用C#调用API搞定!!!使用的是mciSendString API函数主要参考了 ...
- Java基础知识 ——JDK,JRE和JVM
1.开发简单的Java程序过程: 名词解释: JDK:JDK是 Java 语言的软件开发工具包,主要用于移动设备.嵌入式设备上的java应用程序.JDK是整个java开发的核心,它包含了JAVA的运行 ...