vue中父组件如何把值传给子组件

可以通过props属性将父组件的值传递给子组件。具体方法如下：

在子组件中定义props属性

在子组件中定义一个props属性，用来接收父组件传递过来的值。

// 子组件
<template>
  <div>{{ msg }}</div>
</template>

<script>
export default {
  props: {
    msg: {
      type: String,
      required: true
    }
  }
}
</script>

在上面的代码中，子组件定义了一个名为msg的props属性，用来接收父组件传递过来的字符串类型的值。

在父组件中传递值

在父组件中使用子组件时，可以通过v-bind指令将值传递给子组件的props属性。

// 父组件
<template>
  <div>
    <child-component :msg="message"></child-component>
  </div>
</template>

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

export default {
  components: {
    ChildComponent
  },
  data() {
    return {
      message: 'Hello Vue!'
    }
  }
}
</script>

在上面的代码中，父组件通过v-bind指令将message的值传递给子组件的msg属性。

需要注意的是，在子组件中定义的props属性必须要在父组件中使用时传递，否则会在控制台报错