vue 传递父组件的参数给子组件

Vue.js中，将父组件的参数传递给子组件通常通过props（属性）的方式实现。Props是单向数据流的一部分，它允许父组件向子组件传递信息。以下是基本步骤：

1. **定义父组件**: 父组件需要声明一个prop，并为其提供默认值，这是要传递给子组件的数据。例如：

   <template>
     <div>
       <child-component :message="parentMessage"></child-component>
     </div>
   </template>

   <script>
   export default {
     data() {
       return { parentMessage: 'Hello from Parent' };
     }
   }
   </script>

2. **使用父组件的prop**: 子组件接收到这个prop并在模板中使用它，通常加前缀`:`表示这是一个来自父组件的数据。

   <template>
     <p>{{ message }}</p>
   </template>

   <script>
   export default {
     props: {
       message: String // 定义接受的是字符串类型的prop
     }
   }
   </script>