可以给父组件写一个ref属性,父组件可以通过ref拿到子组件中的数据和方法(即例子中子组件的say方法),这样在父组件中就可以触发子组件的事件了。而父组件向子组件传参可以通过prop属性(即例子中的formData)。

父组件

提交

import children from './children.vue'

export default {

data () {

return {

formData:{

name:'',

mobile: ''

}

}

},

methods:{

handleSubmit(){

this.$refs.children.say();

}

},

components:{

'children': children

}

}

子组件

我是子组件

export default {

//父组件通过props属性传递进来的数据

props: {

formData: {

type: Object,

default: () => {

return {}

}

}

},

data () {

return {

childrenSay: 'hello, parent'

}

},

methods: {

say(){

console.log(this.childrenSay);

}

}

}

vue 事件调用 传参_vue如何在父组件指定点击事件后向子组件传递参数并调用子组件的事件?...相关推荐

  1. vue 事件调用 传参_Vue 事件如何传递参数?

    Vue 事件如何传递参数? 事件函数参数传递: 普通参数和事件对象传递格式如下: 调用函数传参 点秋香 vue事件绑定-参数传递实例如下: vue事件绑定-参数传递 xinbiancheng.cn { ...

  2. vue 分享微信传参_vue 中使用微信分享接口(简单实用)

    前言 开发微信小程序时,基本上都要接入微信的SDK,而微信也提供了非常多的接口供我们去完成我们想要的功能.微信分享功能常常是我们在开发中常见的需求之一,本文将围绕微信分享接口使用展开,给自己以后碰到需 ...

  3. vue 分享微信传参_vue实现微信分享链接添加动态参数的方法

    微信分享时 分享链接携带参数可能不是固定的 需要在分享的前一刻才知道 这里就是动态设置分享链接的基本写法 代码不是那么详尽 但大致流程如下 1.安装引用jssdk npm install --save ...

  4. Vue过滤器的传参使用及案例

    Vue过滤器的传参使用及案例 过滤器用于一些常见的文本格式化 过滤器的第二个参数为可选 使用位置 过滤器可以用在两个地方:双花括号插值{{ }}和 v-bind 表达式** 使用方法 {{ 变量 | ...

  5. 事件——事件绑定||事件函数传参||事件修饰符||按键修饰符||自定义按键修饰符

    事件绑定 <!DOCTYPE html> <html lang="en"><head><meta charset="UTF-8& ...

  6. java调用jar并传参,Java项目导出为jar包+导出第三方jar包+使用命令行调用+传参

    Java项目导出为jar包+导出第三方jar包+使用命令行调用+传参 一.打包 情况1:不需要向程序传参数,并且程序没有使用第三方jar包 Eclipse上导出jar: 然后选择一个java文件作为入 ...

  7. java与js交互,相互调用传参

    随着前端技术的发展与H5的广泛使用,移动端采用native+h5的方式越来越多了,对于Android来说就涉及到java与js的交互,相互调用传参等.下面就来看一下java与js交互的简单demo. ...

  8. 【Vue】路由传参方式

    在使用params传递参数时,需要使用name来指定目标,否则会出现数据传输失败 vue的路由传参共有三种方式 1.query传参:不管使用path还是name来匹配路由都可以,然后通过query来传 ...

  9. Vue动态路由传参和监听路由

    Vue动态路由传参 query传参 params传参 //定义Detail路由 {path: '/detail/:id',name: 'Detail'component: () => impor ...

最新文章

  1. 电子计算机发展迅,ENIAC问世以来的短短的四十多年中,电子计算机的发展异常迅速...
  2. Linux下查看文件或文件夹大小的命令df 、du、ls
  3. J-Flash的使用
  4. NVIDIA与服务器制造商合作推进AI云计算
  5. Linux系统查看分区文件系统类型
  6. gpg keys for php 5.5,Fedora解决/etc/pki/rpm-gpg/RPM-GPG-KEY-fedora-x86_64问题
  7. 写给软件工程师的 30 条建议
  8. Android高级-Android操作SQL数据管理,增删改查
  9. Linux 下用yum安装mysql
  10. Java IO3:字符流
  11. 2013 ACM区域赛长沙 H zoj 3733 (hdu 4798) Skycity
  12. 基于麻雀算法优化的核极限学习机(KELM)分类算法 - 附代码
  13. 如何创建和使用Web服务(转)
  14. Linux安装配置硬件温度及风扇转速监测软件(sensor、psensor)
  15. 计算机书籍每周销量排行榜
  16. 20121214收藏
  17. win10系统版本更新旧版本文件清理:如何安全删除win10中的Windows.old文件夹
  18. html5微杂志源码,H5制作又一利器:分分钟制作一个H5页面
  19. 禅与摩托车维修艺术(2)
  20. 五子棋对战——重点实现

热门文章

  1. SQL Server自动化运维系列——监控磁盘剩余空间及SQL Server错误日志(Power Shell)...
  2. 【算法笔记】B1058 选择题
  3. Docker环境搭建,K8s
  4. 数组的方法之(Array.prototype.reduce() 方法)
  5. [凯立德]2015春季版C2739-M7L83-3521JON,已O+带3D+带路况
  6. Flex 4命名空间
  7. linux mysql更改用户权限
  8. CYQ.IISLogViewer 一款IIS 日志分析工具 V1.0 发布[提供源码]
  9. CYYMysql 源码解读 2
  10. AndroidStudio安卓原生开发_UI控件_SeekBar_ProgressBar_DataPicker---Android原生开发工作笔记99