vue 子组件调用父组件方法&数据

vue有$parent这么一个属性,在子组件中就能拿到父组件的数据

this.$parent.xxx

就能调用父组件的方法

this.$parent.xxx()

父组件调用子组件的方法&数据

在页面中子组件展示例如:

 components:{my-temp:myTemp},

这里需要加上一个ref 

<my-temp ref="myComent"></my-temp>

然后就是获取子组件的Data数据

this.$refs.xxx

调用子组件的方法

this.$refs.xxx()

vue父子组件之间互相获取data值&调用方法(非props)的更多相关文章

  1. 【转】vue父子组件之间的通信

    vue父子组件之间的通信 在vue组件通信中其中最常见通信方式就是父子组件之中的通性,而父子组件的设定方式在不同情况下又各有不同.最常见的就是父组件为控制组件子组件为视图组件.父组件传递数据给子组件使 ...

  2. 浅谈vue父子组件之间的传值

    前言:本章主要说下父子组件的传值,为商品列表组件之间的传值做一个基础预热.Github:https://github.com/Ewall1106/mall(请选择分支chapter23) 1.父组件向 ...

  3. vue父子组件之间传值

    vue父子组件进行传值 vue中的父子组件,什么是父组件什么是子组件呢?就跟html标签一样,谁包裹着谁谁就是父组件,被包裹的元素就是子组件. 父组件向子组件传值 下面用的script引入的方式,那种 ...

  4. 关于Vue父子组件传值(复杂数据类型的值)的细节点

    vue 父子组件传值是很常见的,多数情况下都是父传递给子的值是基础数据类型,如string,number,boolean, 当父组件值被修改时,子组件能够实时的作出改变. 如果父子传值的类型是复杂数据 ...

  5. Vue父子组件之间的相互通信

    组件是Vue知识体系中最重要的一部分之一,父子组件由于作用域的不同,无法直接对对方的数据进行操作.它们之间的数据传递都是通过中间介质进行的,父组件给子组件传值是通过props属性,而子组件给父组件传值 ...

  6. VUE 父子组件之间通信传值 props和 $emit

    1.父组件传值给子组件 $props,子组件传值给父组件 $emit 父组件          <div id="app" >               <tr ...

  7. Vue父子组件之间的通讯(学习笔记)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. vue父子组件之间的通信

    利用props在子组件接受父组件传过来的值1.父组件parentComp.vue <template> <childComp :fromParentToChild="fro ...

  9. Vue父子组件之间通信

    1.父 -> 子.通过props //father.vue <template> <div id="father"> <div><l ...

随机推荐

  1. 【转】Android 增,删,改,查 通讯录中的联系人

    一.权限 操作通讯录必须在AndroidManifest.xml中先添加2个权限, <uses-permission android:name="android.permission. ...

  2. 好程序员web前端分享18个用CSS制作出来的东西

    好程序员web前端分享18个用CSS制作出来的东西,与流行的看法相反,CSS不仅仅是用来提供一个WEB页面的基本风格,以使它看起来更有吸引力.还有很多其他的事情,CSS也可以做的很好.由于它创建动画和 ...

  3. day 13 迭代器、可迭代对象、迭代器对象、生成器、生成器对象、枚举对象

    迭代器大概念 # 迭代器:循环反馈的容器(集合类型)# -- 不同于索引取值,但也可以循环的从容器对象中从前往后逐个返回内部的值​# 优点:不依赖索引,完成取值# 缺点:不能计算长度,不能指定位取值( ...

  4. 如何判断app的页面是原生的还是H5的webview页面

    1.看布局边界(在手机侧观察) 开发者选项->显示布局边界,页面元素很多的情况下布局是一整块的是h5的,布局密密麻麻的是原生控件.页面有布局的是原生的,否则为h5页面.(仅针对安卓手机试用)如下 ...

  5. 646. Maximum Length of Pair Chain(medium)

    You are given n pairs of numbers. In every pair, the first number is always smaller than the second ...

  6. python的web运用

    ---恢复内容开始--- 对于大多数学过编程语言的人来说都知道大部分的编程语言都可以用来开发web运用,对于python来说也是可以的,不过对于web开发来说用python你可以选择 两个不同的框架, ...

  7. Oracle的表被锁后的恢复

    运行下列SQL,找出数据库的serial#,执行结果如下图所示 SELECT T2.USERNAME, T2.SID, T2.SERIAL#, T2.LOGON_TIME   FROM V$LOCKE ...

  8. mybatis 使用auto mapping原理实现表间关联

    Auto mapping的示例 数据库中有一个person表,结构如下: mysql> desc person; +-------+-------------+------+-----+---- ...

  9. CentOS 7 常用命令

    1.防火墙 yum install firewalld #安装firewalld 防火墙 systemctl start firewalld.service #开启防火墙 systemctl stop ...

  10. DAO 四个包的建立

    一.DAO 四个包的建立,降低代码之间的耦合性? 之前写代码,都是在一个包下.代码耦合性较高,不利于后期的维护. dao(代码分层?) 有利于后期的维护代码,修改方便. com.aaa.dao 存放d ...