vue中父组件和子组件间传值方法(主动获取)

在vue项目开发中,组件之间的相互传值是经常要用到的,而这其中父子组件间的传值更为常见,本文主要介绍的是在vue中,父组件如何直接获取子组件的数据和方法,以及子组件如何直接调用或者获取父组件的数据和方法。当然这样的传值方式不是很推崇,不过在一些情况下,还是能帮助我们解决问题的。

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

 1).调用子组件的时候定义一个ref

   <v-header ref="header"></v-header>

  2).在父组件里面通过  this.$refs.header.属性   this.$refs.header.方法

   调用子组件的时候定义一个ref 如下 子组件

vue中父组件和子组件间传值方法(主动获取)

    然后在父组件的方法中通过this.$refs.名字.属性或者this.$refs.名字.方法主动获取子组件的数据或者方法

    父组件

vue中父组件和子组件间传值方法(主动获取)

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

子组件主动获取父组件的数据和方法主要使用以下方法   this.$parent.数据   this.$parent.方法

vue中父组件和子组件间传值方法(主动获取)

   

有需要的朋友可以参考,希望对你的开发有所帮助。