前言

很多时候用$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子组件传出多个参数,如何在父组件中在接收所有参数的同时添加自定义参数的更多相关文章

  1. vue组件之间的通信以及如何在父组件中调用子组件的方法和属性

    在Vue中组件实例之间的作用域是孤立的,以为不能直接在子组件上引用父组件的数据,同时父组件也不能直接使用子组件的数据 一.父组件利用props往子组件传输数据 父组件: <div> < ...

  2. Vue 父组件向子组件传值,传方法,传父组件整体

    父子组件传值 1.父组件调用子组件时绑定属性,例如-> :title="title" 2.子组件中在props中声明title:props:['title','msg'] 3 ...

  3. SpringMVC中控制器接收JSP页面表单的参数接收方式详解及细节注意(400错误)

    控制器方法中参数的接收 (1)以前的参数接收: String  param = req.getParameter(name): (2)SpringMVC简化这个操作,只需要给控制器方法添加参数即可 a ...

  4. SpringMVC中@RequestBody接收前端传来的多个参数

    在使用ajax发送请求时,如果发送的JSON数据是一个类中的不同属性,在Controller方法中使用@RequestBody会直接封装进该类中 例如: 前端部分代码 JavaScript <s ...

  5. $emit子组件传出多个参数,如何在父组件中在接收所有参数的同时添加自定义参数

    很多时候用$emit携带参数传出事件,并且又需要在父组件中使用自定义参数时,这时我们就无法接受到子组件传出的参数了.    找到了两种方法可以同时添加自定义参数的方法. 方法一:子组件传出单个参数时 ...

  6. vue子组件向父组件传递参数的基本方式

    子组件: this.$emit('transferUrl', this.picUrl) 父组件: 引入子组件<pics @transferUrl="gettransferUrl&quo ...

  7. 子组件通过 $emit 触发父组件的自定义事件

    子组件: <template> <div class="train-city"> <h3>父组件传给子组件的toCity:{{sendData} ...

  8. vue.js事件传值之子组件传向父组件以及$emit的使用

    在项目开发中,有时候会遇到一种需求比如是:在子组件中,通过一个事件,比如点击事件,去改变父组件中的某个值,下面来看看是怎么个流程 还是先截图目录结构 父组件为app.vue,components中的文 ...

  9. Vue 子组件向父组件传参

    直接上代码 <body> <div id="counter-event-example"> <p>{{ total }}</p> & ...

随机推荐

  1. JS高级学习历程-5

    [闭包] 定义:闭包就是一个函数 条件:一个函数去嵌套另外一个函数,里边的函数就是闭包 function  f1(){ function f2(){ } } 特点:闭包函数有权访问父级环境的变量信息.

  2. enum StatCode

    public enum StatCode { NORMAL(0,"正常"), FLAME_OUT(1,"熄火"), NOT_INSTALL(2,"未安 ...

  3. nginx超时问题

    一. 戏说不管你是做运维还是做开发,哪怕你是游客,时不时会遇到502 Bad Gateway或504 Gateway Time-out.出现这页面,把服务重启下,再实在不行重启下服务器,问题就解决了, ...

  4. 洛谷 P1969 积木大赛

    题目描述 春春幼儿园举办了一年一度的“积木大赛”.今年比赛的内容是搭建一座宽度为n的大厦,大厦可以看成由n块宽度为1的积木组成,第i块积木的最终高度需要是hi. 在搭建开始之前,没有任何积木(可以看成 ...

  5. webpack分开打包和合并打包的瘦身

    webpack.config.js 记录一下优化webpack的几个点: 1.     devtool: false,   //产品阶段不应该有devtool entry: { bundle : pa ...

  6. MyBatis配置文件之概述

    MyBatis配置文件所有元素 <?xml version="1.0" encoding="UTF-8"?> <configuration&g ...

  7. 编译安装php容易出现的问题以及解决办法

    http://crybit.com/20-common-php-compilation-errors-and-fix-unix/

  8. iOS Programming Autorotation, Popover Controllers, and Modal View Controllers

    iOS Programming Autorotation, Popover Controllers, and Modal View Controllers  自动旋转,Popover 控制器,Moda ...

  9. mysql-练级查询

    mysql的链接查询中主要有五大类链接查询 1.内连接查询 1.1:等值链接查询:指使用等号"="比较两个表的连接列的值,相当于两表执行笛卡尔后,取两表连结列值相等的记录. SEL ...

  10. Mysql-数据库及数据表结构和操作

    1.数据库系统:数据库系统是用来维护和管理数据库的系统工具,数据库系统拥有自己的用户名和密码 1.1.显示该系统中的数据库:Show databases; 1.2.创建数据库:Create datab ...