VUE中父组件向子组件进行传值

在 Vue 中，父组件向子组件传值主要通过在子组件的标签上绑定属性（props）的方式来实现。以下是一个具体的示例。

父组件（ParentComponent.vue）:

<template>
  <div>
    <!-- 父组件中使用子组件，并传递一个名为 message 的值 -->
    <ChildComponent :message="parentMessage" />
  </div>
</template>

<script>
// 导入子组件
import ChildComponent from './ChildComponent.vue';

export default {
  name: 'ParentComponent',
  components: {
    ChildComponent, // 注册子组件
  },
  data() {
    return {
      parentMessage: 'Hello from parent!', // 定义父组件的数据
    };
  },
};
</script>

子组件（ChildComponent.vue）:

<template>
  <div>
    <!-- 子组件中接收父组件传递的 message 值 -->
    <p>{
  { receivedMessage }}</p>
  </div>