vue子组件获取父组件值

在Vue中，子组件可以通过props属性获取父组件传递的值。以下是一个简单的例子：

<template>
  <div>
    <p>父组件值：{{ parentValue }}</p>
    <child-component :childProp="parentValue"></child-component>
  </div>
</template>

<script>
import ChildComponent from './ChildComponent.vue';

export default {
  components: {
    ChildComponent
  },
  data() {
    return {
      parentValue: '这是父组件的值'
    };
  }
};
</script>

在上面的例子中，父组件通过props属性将`parentValue`传递给子组件。子组件可以使用`props`接收这个值，并在模板中使用。以下是子组件的示例：

<template>
  <div>
    <p>子组件值：{{ childProp }}</p>
  </div>
</template>

<script>
export default {
  props: ['childProp']
};
</script>

在子组件中，我们定义了一个`childProp`的props属性，它接收来自父组件的值。你可以在子组件的模板中使用`childProp`来访问这个值。

这样，子组件就能够获取到父组件的值了。