Uniapp中props的使用

在Uniapp中，使用props​可以从父组件向子组件传递数据或配置信息。下面是使用 ​props的步骤：

1. 在父组件中定义需要传递给子组件的属性。

   <template>
     <div>
       <child-component :message="msg"></child-component>
     </div>
   </template>
   
   <script>
   export default {
     data() {
       return {
         msg: 'Hello from parent component'
       }
     }
   }
   </script>

2. 在子组件中声明 ​props​，接收父组件传递的属性。

   <template>
     <div>
       <p>{{ message }}</p>
     </div>
   </template>
   
   <script>
   export default {
     props: {
       message: {
         type: String,
         default: ''
       }
     }
   }
   </script>

   ​
   

在上述示例中，父组件使用 ​<child-component>​标签引入了子组件，并通过 ​:message​指令将父组件的 ​msg​属性传递给子组件的 ​message​属性。

注意，子组件中的 ​props​属性是一个对象，其中的键名表示接收的属性名，键值定义了该属性的类型和默认值。可以使用 ​type​设置属性的类型，常见的类型包括：String、Number、Boolean、Array、Object等。还可以使用 ​default​属性指定默认值，在父组件未传递该属性时生效。

通过以上步骤，父组件就可以将数据传递给子组件，并在子组件中使用 ​props​进行接收和处理。注意，​props​是单向数据流的，只能由父组件传递给子组件，在子组件内部不可修改父组件传递过来的属性。如果需要在子组件内部修改这些数据，则应该使用 ​data​来声明组件的局部数据。