子组件主动获取父组件的数据和方法

简单示例:

this.$parent.数组

this.$parent.方法

示例:

<template>
<div id="Header">
<p>我是一个头部组件</p>
<input type="button" value="获取父组件的属性和方法" @click="getParent()">
</div>
</template>
<script>
export default {
name: 'HelloWorld',
data () {
return {
text:'我是子组件的属性'
}
},
methods:{
run(){
alert('我是子组件的方法');
},
getParent(){
alert(this.$parent.msg); // 获取父组件的方法
this.$parent.run(); // 获取父组件的的方法
}
},
}
</script>

vue--子组件主动获取父组件的数据和方法的更多相关文章

  1. vue 父组件主动获取子组件的数据和方法 子组件主动获取父组件的数据和方法

    Header.vue <template> <div> <h2>我是头部组件</h2> <button @click="getParen ...

  2. Vue 父组件主动获取子组件的值,子组件主动获取父组件的值

    父组件主动获取子组件的值 1. 在调用子组件的时候定义一个ref-> ref="header"2. 在父组件中通过this.$refs.header.属性,调用子组件的属性, ...

  3. vue.js 父组件主动获取子组件的数据和方法、子组件主动获取父组件的数据和方法

    父组件主动获取子组件的数据和方法 1.调用子组件的时候 定义一个ref <headerchild ref="headerChild"></headerchild& ...

  4. vue组件通信之父组件主动获取子组件数据和方法

    ref 可以用来获取到dom节点,如果在组件中应用,也可以用来获取子组件的数据和方法. 比如,我定义了一个home组件,一个head组件,home组件中引用head组件. 此时,home组件是head ...

  5. 子组件获取父组件数据 propsDown, 父组件获取子组件数据 eventUp

    (一) popsDowm 三种方法获取父组件数据:被动获得(1):主动获取(2). 1.被动获得: 父组件:v-bind: 绑定变量参数和方法参数:子组件:props 接收参数.可以在模板中直接使用也 ...

  6. Vue父组件主动获取子组件的数据和方法

    Vue父组件主动获取子组件的数据和方法 https://www.jianshu.com/p/bf88fc809131

  7. vue--父组件主动获取子组件的方法

    父组件主动获取子组件的方法和属性 第一步:调用自组件的时候,给自组建定义一个Header <v-header ref='headerInfo'></v-header> 第二步: ...

  8. VUE里子组件获取父组件动态变化的值

    在VUE里父组件给子组件间使用props方式传递数据,但是希望父组件的一个状态值改变然后子组件也能监听到这个数据的改变来更新子组件的状态. 场景:子组件通过props获取父组件传过来的数据,子组件存在 ...

  9. 九、React中的组件、父子组件、React props父组件给子组件传值、子组件给父组件传值、父组件中通过refs获取子组件属性和方法

    一.概述 React中的组件: 解决html 标签构建应用的不足. 使用组件的好处:把公共的功能单独抽离成一个文件作为一个组件,哪里里使用哪里引入. [父子组件]:组件的相互调用中,我们把调用者称为父 ...

随机推荐

  1. Eclipse中项目全部报错----项目全部打红叉的解决办法

    今天遇到一个超级郁闷的事情,Eclipse新建的项目全部都打有红叉,我起初以为自 己可能是因为这两天一直在配置NDK开发环境方面的东西,是不是一不小心把那个地方给配置了,然后新建项目时项目都会出现红叉 ...

  2. Ubuntu下使用dialog制作菜单执行简单脚本

    新建test5 #!/bin/bash #using select in the menu temp=$(mktemp -t test.XXXXXX) temp2=$(mktemp -t test2. ...

  3. 教你下载BarTender 2016

    BarTender是全球领先标签.条形码.RFID和证卡设计打印软件,功能强大,操作简单,具有很强的灵活性.目前,BarTender软件已更新至最新版BarTender 2016.BarTender ...

  4. QT基础:QMainWindow学习小结

    简述 普通的桌面应用程序有个共同的特性,有菜单栏.工具栏.状态栏.中央窗口等部件.菜单栏其实可以看成是一个窗口,菜单栏中的每一个菜单也可以看成一个窗口,每个部件基本都可以认为是一个窗口.那么这些典型的 ...

  5. 使用T4模板调用Sqlserver链接生成自己的模板

    <#@ template debug="false" hostspecific="false" language="C#" #> ...

  6. php扩展yaf 按照配置

    Yaf,全称 Yet Another Framework,是一个C语言编写的PHP框架,是一个用PHP扩展形式提供的PHP开发框架, 相比于一般的PHP框架, 它更快. 它提供了Bootstrap, ...

  7. Redis使用示例及在PHP环境中用redis存储session

    在文件夹redis-3.2.0下 1. 启动redis服务 nohup ./src/redis-server redis.conf & 2. 停止服务 #使用客户端 ./src/redis-c ...

  8. 如何分析解决Android ANR(转载)

    转载自:http://blog.csdn.net/dadoneo/article/details/8270107 一:什么是ANR ANR:Application Not Responding,即应用 ...

  9. Android跑指定包Monkey脚本

    Android跑指定包Monkey脚本 adb shell monkey –p com.android.mms --throttle 1000 -v -v -v -s 1 --ignore-secur ...

  10. __stdcall __cdecl 引起的程序崩溃

    崩溃弹出的截图如下 看到0xC0000005, 访问冲突的问题, 九成九是内存访问违规, 比如访问了已经释放的指针, 又或者是离开函数时栈被破坏之类. 找了一下午一直没有头绪, 好在有一份可以执行的源 ...