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

简单示例:

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. 解决js中window.location.href不工作的问题

    E6中在html中<a>标识中通过JS添加click事件调用一个JS函数,例如: < script   type = "text/javascript" > ...

  2. VS2008编译错误:error C2065: 'PMIB_TCPSTATS' : undeclared identifier c:\program files (x86)\microsoft sdks\windows\v7.0a\include\iphlpapi.h 411

    安装了VS2008编译之前的程序,结果出现了编译错误,以为是VS2008的Sp1补丁没装好,重装补丁后还是不行,编译错误如下: 双击错误会定位在iphlpapi.h中, 一个可行的解决办法是:把iph ...

  3. WIN7隐藏GUEST登录账户

    在Windows7中,我们有时候需要开启Guest用户,以方便给别的同事共享打印机和部分文件,但同时又不希望别人用Guest账号从本地登陆界面进入本机.这个时候就需要将本地登陆界面的Guest用户进行 ...

  4. SpringMVC -- 梗概--源码--贰--异常管理

    附:实体类 Class : User package com.c61.entity; import java.text.SimpleDateFormat; import java.util.Date; ...

  5. RESTful状态码说明

    https://www.zhihu.com/question/58686782/answer/159603453 常用状态码: 200 请求成功并返回所需资源 400 客户端请求有语法错误 401 未 ...

  6. javascript 显示一定范围内的素数(质数)

    素数又称质数,是大于1的自然数,并且只有1和它本身两个因数. 具体实现代码如下: 运行代码 <!DOCTYPE HTML> <html> <head lang=" ...

  7. 《C++标准程序库》笔记之四

    本篇博客笔记顺序大体按照<C++标准程序库(第1版)>各章节顺序编排. ---------------------------------------------------------- ...

  8. JSP中的动态包含和静态包含的区别

    本文转载自http://blog.csdn.net/xuxu198899223/article/details/8501044 1. 语法格式 (1)静态包含:<%@ include file= ...

  9. 启用PAE后虚拟地址到物理地址的转换

      34 注册:2013-10 帖子:2013 精华:34 --> [原创]启用PAE后虚拟地址到物理地址的转换 安于此生 2013-11-3 20:54 16073 由常规的两级页表转换得不到 ...

  10. tp3.2分页功能

    后台 1.利用Page类和limit方法分页 $User = M('User'); // 实例化User对象 $count = $User->where('status=1')->coun ...