Vue.js 是一个用于构建用户界面的渐进式 JavaScript 框架，它将应用程序的复杂性抽象成一个组件化的开发模式。在 Vue.js 中，组件可以通过 props 属性进行数据的传递，而父组件获取子组件的值有多种方法。
一、通过 props 属性传递数据
父组件可以通过在子组件上定义 props 来传递数据到子组件中，子组件可以通过 this.$props 的方式来获取父组件传递过来的值。
下面是一个简单的示例：
父组件代码：
```
子组件的值：{{ childValue }}
```
子组件代码：
```
父组件的值：{{ message }}
```
在上面的示例中，父组件通过使用冒号(`:`)语法将 message 作为 props 传递给子组件 ChildComponent，并在子组件中通过 this.$props.message 获取父组件传递过来的值。父组件中通过 computed 属性将子组件的值 childValue 获取到，并在模板中进行展示。
二、通过 ref 属性获取子组件实例
Vue.js 中的 ref 属性可以用来获取组件的实例，通过组件实例可以访问子组件的数据和方法。
下面是一个示例：
父组件代码：
```
子组件的值：{{ childValue }}
```
子组件代码：
```
子组件的值：{{ childValue }}
```
在上面的示例中，父组件通过在子组件上设置 ref 属性来获取子组件的实例，并在 mounted 钩子函数中调用 getChildValue 方法来获取子组件的值 childValue。子组件中的 childValue 是内部使用的数据，父组件通过 $refs 属性访问子组件实例的属性或方法。
总结：
父组件获取子组件的值有两种方式，一种是通过 props 属性进行数据的传递，可以在子组件上设置 props 来接收父组件传递的值；另一种是通过 ref 属性获取子组件实例，可以通过子组件的实例访问子组件的数据和方法。
QQ客服