1. 父组件调用子组件时,在调用处传给子组件一个方法

:on-update="updateData"
 
2. 子组件在props中,接收这个方法并声明
props: {
 onUpdate: Function
}
 
3. 子组件中,需要通知父组件时,调用onUpdate这个方法,并传入参数data
this.opUpdate(data)
 
4. 父组件中,通过updataData方法,获取到子组件传过来的data,并做以操作
updateData (data) {
 // 这里可以使用子组件传过来的数据data
 // 也可以放子组件需要调用的父组件方法
}

关于Vue中,父组件获取子组件的数据(子组件调用父组件函数)的方法的更多相关文章

  1. asp.net中调用javascript自定义函数的方法(包括引入JavaScript文件)总结

    通常javascript代码可以与HTML标签一起直接放在前 端页面中,但如果JS代码多的话一方面不利于维护,另一方面也对搜索引擎不友好,因为页面因此而变得臃肿:所以一般有良好开发习惯的程序员都会把 ...

  2. 在vue中使用基于d3为基础的dagre-d3.js搞定一个流程图组件

    项目中想搞定一个流程图,开始使用了阿里的G6,但是G6目前不支持手势,这样就很郁闷了,因为公司的领导都是使用iPad看的,你不支持手势是不行的,后来又想到了百度的echarts,试了试,感觉还不错,手 ...

  3. vue中怎么实现获取当前点击对象this

    应用场景 在评论列表中,有很多条评论(通过循环出来的评论列表),评论的文字有多跟少,默认展示2行超出显示点击查看更多,,要点击查看更多对当前的这条评论进行全部评论展示! 问题描述 要是在传统的点击事件 ...

  4. Vue 中 换行符获取

    当要获取到 vue 中 文本域的换行符时, 需要用到正则匹配. let reg = new RegExp('/n',"g"); let str = text.replace(reg ...

  5. vue 双向数据绑定 Vue事件介绍 以及Vue中的ref获取dom节点

    <template> <div id="app"> <h2>{{msg}}</h2> <input type="te ...

  6. Vue 及双向数据绑定 Vue事件 以及Vue中的ref获取dom节点

    <template> <div id="app"> <h2>{{msg}}</h2> <input type="te ...

  7. vue2.* 双向数据绑定 Vue事件介绍 以及Vue中的ref获取dom节点 04

    <template> <div id="app"> <!-- 双向数据绑定(必须在表单里面使用) m:model v:view mvvm:model改 ...

  8. vue中 表头 th 合并单元格,且表格列数不定的动态渲染方法

    吐槽 今天,在vue中遇到 复杂表格的渲染 ,需要合并表头th的单元格,且合并单元格的那列的表头数据是动态数据,也就是不知道会有多少个表头列,而这几个表头列还分了好几个子表头. 这个需求在js里用Ju ...

  9. vue中 表头th 合并单元格,且表格列数不定的动态渲染方法

    吐槽 今天,在vue中遇到 复杂表格的渲染 ,需要合并表头的单元格,且合并单元格的那列还是动态数据,也就是说你不知道会有多少组要合并起来,哎,我也有点说不清楚,废话不多说了,看代码把: 代码示例 da ...

  10. html中通过js获取接口JSON格式数据解析以及跨域问题

    前言:本人自学前端开发,一直想研究下js获取接口数据在html的实现,顺利地找到了获取数据的方法,但是有部分接口在调用中出现无法展示数据.经查,发现时跨域的问题,花费了一通时间,随笔记录下过程,以方便 ...

随机推荐

  1. Docs-.NET-C#-指南-语言参考-关键字-值类型:可以 null 的值类型

    ylbtech-Docs-.NET-C#-指南-语言参考-关键字-值类型:可以 null 的值类型 1.返回顶部 1. Nullable value types (C# reference) 2019 ...

  2. Android 打开相册拍照选择多张图片显示

    添加依赖: compile 'me.iwf.photopicker:PhotoPicker:0.1.8' compile 'com.jaeger.ninegridimageview:library:1 ...

  3. Flutter修改应用图标及图标

    应用名称是需要在 Android 和 iOS 中分别调整的:Android 是在 AndroidManifest.xml 中修改:iOS 则是在 Info.plist 中修改的: 如果需要更改应用的 ...

  4. Django ORM的继承关系

    ORM中通常将对象引用映射到外键,但是对于继承,关系数据库中没有自然有效的方法来对应.从数据存储的角度来看,在映射继承关系时,可以采用几种方式(参考JPA中的InheritanceType.定义): ...

  5. 算法习题---5-3卡牌游戏(UVa10935)

    一:题目 给定n张卡片,按照1-n的顺序编号,然后拿出一张卡片扔掉,拿出一张卡片放到最后,重复该操作直到只剩1张卡片. 求扔掉的卡片序列和最后剩的卡片的编号. (一)样例输入 7 //卡牌编号从1到7 ...

  6. MD5Encrypt加密

    package utils; import java.security.MessageDigest; public class MD5Encrypt { public MD5Encrypt() { } ...

  7. 123457123456#2#----com.MCgame.ShuXueKoSuan98--前拼后广--儿童小学数学口算Game-mc22222

    com.MCgame.ShuXueKoSuan98--前拼后广--儿童小学数学口算Game-mc

  8. sqoop import mysql to hive table:GC overhead limit exceeded

    1. Scenario description when I use sqoop to import mysql table into hive, I got the following error: ...

  9. 迅速生成项目-vue-nuxtjs

    一.介绍nuxtjs 后端渲染开源库. 参考链接:https://nuxtjs.org/guide 语言:js 模版:vue 二.从脚手架生成项目(方案A) 推荐指数:

  10. 如何愉悦使用mybatis

    mybatis-generator+plugins 单独的generator是免不了全部人工的,配上各种插件则不然,感谢项目 itfsw/mybatis-generator-plugin 使用如下: ...