vue 父传子 子组件props用对象方式怎么接收并使用

在Vue中，父组件通过props将数据传递给子组件。如果父组件通过对象方式传递数据，子组件需要使用对象的属性来接收数据。

例如，父组件传递以下对象数据给子组件：

<template>
  <child-component :user="{ name: 'John', age: 30 }"></child-component>
</template>

子组件可以通过props来接收这个对象：

<template>
  <div>
    <p>Name: {{ user.name }}</p>
    <p>Age: {{ user.age }}</p>
  </div>
</template>

<script>
export default {
  name: 'ChildComponent',
  props: {
    user: Object
  }
}
</script>

在子组件中，我们定义了一个名为`user`的props，它的类型是`Object`。然后在模板中，我们使用`user`对象的属性来显示数据。

注意：如果父组件传递的对象数据为空，子组件需要对props进行校验，避免出现数据类型错误或空指针异常。可以使用`required`属性来指定必传参数，或者使用`default`属性来设置默认值。例如：

props: {
  user: {
    type: Object,
    required: true,
    default: () => ({ name: '', age: 0 })
  }
}