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

简单示例:

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. 用Fiddler查看 Android/iOS 网络请求

    1.下载fiddler,尽量到官方网站找最新的版本 我这里也放了一个:http://files.cnblogs.com/xiaokang088/fiddler4setup.zip 2. 打开Fiddl ...

  2. java使用jdom生成xml格式文件

    本文生成xml使用的工具是jdom.jar,下载地址如下: 链接:https://eyun.baidu.com/s/3slyHgnj 密码:0TXF 生成之后的文档格式类型,就如上面的图片一样,简单吧 ...

  3. MAC软件下载比较好的三个第三方网站

    http://soft.macx.cn; http://www.applex.net: http://www.macdang.com;

  4. [SLAM] 01. "Simultaneous Localization and Mapping"

    本篇带你认识SLAM,形成客观的认识和体系 一.通过行业招聘初步了解SLAM 发信人: leecty (Terry), 信区: ParttimeJobPost标 题: 创业公司招SLAM 算法工程师发 ...

  5. POJ 3258 River Hopscotch(二分法搜索)

    Description Every year the cows hold an event featuring a peculiar version of hopscotch that involve ...

  6. ios开发之--仿购物类详情页面数量添加小功能

    话不多说先上图:

  7. headless webkit(无界面浏览器、爬虫)

    phantomjs / puppeteer https://github.com/amir20/phantomjs-node https://github.com/GoogleChrome/puppe ...

  8. FFmpeg X264的preset和tune

    鉴于x264的参数众多,各种参数的配合复杂,为了使用者方便,x264建议如无特别需要可使用preset和tune设置.这套开发者推荐的参数较为合理,可在此基础上在调整一些具体参数以符合自己需要,手动设 ...

  9. Selenium 查找节点

    Selenium 可以驱动浏览器完成各种操作,比如填充表单.模拟点击等.比如,我们想要完成向某个输入框输入文字的操作,总需要知道这个输入框在哪里吧?而 Selenium 提供了一系列查找节点的方法,我 ...

  10. 【摘抄】C++程序员练级攻略

    摘抄自互联网文章 作为C++程序员,或者说程序员一定要提升自己: 专访李运华:程序员如何在技术上提升自己-CSDN.NET专访徐宜生:坚决不做代码搬运工!-CSDN.NET 上面两个文章我觉得都不错. ...