vue学习笔记：父子组件之间的传值$refs和$parent，以及父组件给子组件传值props

父组件获取子组件的值和方法

父组件：

html代码

 
 
 父组件获取子组件的值和方法

js代码：

子组件

html代码：

js代码：

父组件通过引入子组件，并在子组件中加入属性ref="header",然后根据this.$refs.header来获取子组件的属性和方法。

子组件获取父组件的值和方法

在子组件中直接调用this.$parent来获取父组件中的值和方法即可。

父组件通过props给子组件传值

除此之外，父组件还可以通过props给子组件传值

父组件html代码：

父组件js代码：

子组件html代码：

子组件js代码：

这种方法是父组件通过子组件的标签声明变量属性，把父组件的值或者方法传递到子组件，除此之外也可以把父组件实例传递到子组件，如::home='this'就是。

而子组件可以根据props参数，通过传递过来的属性来获取父组件的属性值和方法。