vue父子组件间函数调用

<Child ref="myChild"></Child>
// 父组件
// 引入子组件
import Child from './Child'
export default {
// 注册子组件
components: {Child},
created () {
// 调用子组件中的childMethod,并且传递参数data,需要给子组件添加属性ref
this.$refs.myChild.childMethod(data)
},
methods: {
parentMethod (data) {
console.log(data)
}
}
}
// 子组件
export default {
methods: {
childMethod (data) {
console.log(data)
},
parentMethod (data) {
// 子组件调用父组件函数
// 在一些UI框架中使用无效,可以使用$emit、vuex等其他方法
this.$parent.parentMethod(data)
}
}
}

vue组件间函数调用的更多相关文章

  1. Vue 组件间传值

    前言 Vue 作为现在比较火的框架之一,相信您在使用的过程中,也会遇到组件间传值的情况,本文将讲解几种 Vue 组件间传值的几种方法,跟着小编一起来学习一下吧! 实现 注意: 学习本文,需要您对 Vu ...

  2. vue组件间通信六种方式(完整版)

    本文总结了vue组件间通信的几种方式,如props. $emit/ $on.vuex. $parent / $children. $attrs/ $listeners和provide/inject,以 ...

  3. Vue组件间通信-Vuex

    上回说到Vue组件间通讯,最后留了一个彩蛋~~~Vuex.Vuex是另一种组件通讯的方法,这节来说说Vuex(store仓库). 首先Vuex需要安装,安装的方式有很多,在这里就不一一细说了.我是通过 ...

  4. Vue组件间通信6种方式

    摘要: 总有一款合适的通信方式. 作者:浪里行舟 Fundebug经授权转载,版权归原作者所有. 前言 组件是 vue.js 最强大的功能之一,而组件实例的作用域是相互独立的,这就意味着不同组件之间的 ...

  5. vue 组件间的几种通信方式

    Props配置 原理:通过props配置,进行父子组件间的通信,跨父子通信需要其他组件进行过渡. 使用: 传递方在标签中添加传递内容 <Son :newName="name" ...

  6. webpack+vue 组件间传参(单一事件中心管理组件通信--$root),如果有路由的话会失效

    先给一个例子: <body> <div id="box"> <com-a></com-a> <com-b></co ...

  7. vue 组件间的通信

    (1)props:用于父组件向子组件传递消息 使用方法: 在父组件中,使用子组件时,<Child v-bind:data="data"/>,通过v-bind把子组件需要 ...

  8. vue组件间的通信

    组件的定义: 组件(Component)是 Vue.js 最强大的功能之一.组件可以扩展 HTML 元素,封装可重用的代码.在较高层面上,组件是自定义元素, Vue.js 的编译器为它添加特殊功能.v ...

  9. vue组件间通信

    组件间通信(父子,兄弟) 相关链接\组件通信http://www.cnblogs.com/xulei1992/p/6121974.html 学习链接Vue.js--60分钟快速入门http://www ...

随机推荐

  1. KiCAD输出生产文件

    KiCAD输出生产文件 本文包括PCB生产制造的所有文件的输出方法,包括:BOM.坐标.锡膏层.GERBER.钻孔.丝印和装配图 一.KiCAD导出BOM KiCAD导出BOM有以下几种办法: 注意: ...

  2. HBase封装easy-hbase设计实现

    新增码云地址:https://gitee.com/hanmov5/mop-hbase-template 一.写在前面 业务架构用到HBase,但由于某些不可名状原因,没有用phoniex等上层工具,开 ...

  3. leetcode-161周赛-1250-检查好数组

    题目描述: 唯一的结论是如果数组中所有数的最大公约数为 1,则存在解,否则不存在.所以只需要计算所有数最大公约数即可,时间复杂度O(nlog(m)),其中 m 为数字大小. class Solutio ...

  4. Vivado利用IP自带的示例工程和仿真

    有时候想查看IP的特性和功能,又不想自己写testbench,Vivado自带的IP示例工程就能派上用场,原来一直不知道怎么打开IP的示例工程 第一步:在原有的工程中新建IP,按照你想要的IP属性,例 ...

  5. mac上安装mamp集成环境

    深知mac配置环境是个坑,本人之前用的是xampp因为近期需要mongodb扩展,死活装不明白,索性就换了一个集成环境,在网上找了好多,最后选择了mamp 因为正版的要收费,所以在下载了N个以后终于找 ...

  6. Windows 获取windows密码

    #include <iostream> #define Main main #define COLOR_GREEN system("color 2"); #includ ...

  7. v-for 循环 绑定对象 和数组

    <!--v-for 迭代数组--> <div id="app11"> <div v-for="info in infos"> ...

  8. 云原生数据库崛起,阿里云POLARDB当选世界互联网领先科技成果!

    第六届世界互联网大会来了!千年水乡古镇乌镇又一次吸引了全世界的目光. 刚刚,阿里云自研数据库POLARDB在会上当选世界互联网领先科技成果.POLARDB解决了企业在云时代的数据库难题,帮助企业在数小 ...

  9. 网格图必经点+dfs——cf1214D

    先正着走一次把所有可行路径标记出来,然后倒着走两条路径,一条是能向下就向下的路径,另一条能向右就向右. 如果这两条路径相交,那么(1,1)-(n,m)路径上比有个必经点,把这个必经点封上,答案是1,如 ...

  10. Shell基础(四):字符串截取及切割、字符串初值的处理、基使用Shell数组、expect预期交互、使用正则表达式

    一.字符串截取及切割 目标: 使用Shell完成各种Linux运维任务时,一旦涉及到判断.条件测试等相关操作时,往往需要对相关的命令输出进行过滤,提取出符合要求的字符串. 本案例要求熟悉字符串的常见处 ...