使用作为道具从父组件传递的对象值

// 父组件
function ParentComponent() {
  const user = { name: 'Alice', age: 25 };
  return <ChildComponent user={user} />;
}

// 子组件
function ChildComponent(props) {
  return (
    <div>
      <p>Name: {props.user.name}</p>
      <p>Age: {props.user.age}</p>
    </div>
  );
}

<!-- 父组件 -->
<template>
  <ChildComponent :user="user" />
</template>

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

export default {
  components: {
    ChildComponent
  },
  data() {
    return {
      user: { name: 'Alice', age: 25 }
    };
  }
};
</script>

<!-- 子组件 -->
<template>
  <div>
    <p>Name: {{ user.name }}</p>
    <p>Age: {{ user.age }}</p>
  </div>
</template>

<script>
export default {
  props: {
    user: Object
  }
};
</script>