Vue 中什么是动态 prop？

在Vue中，动态prop是指将组件的属性（props）绑定到一个变量或表达式上，从而使得属性的值能够动态地根据数据的变化而变化。动态prop可以通过两种方式传递给组件：

1. 动态绑定：使用 v-bind 或简写的 : 来将属性绑定到一个变量或表达式上。例如：

   <template>
     <child-component :dynamicProp="parentData"></child-component>
   </template>
   
   <script>
   export default {
     data() {
       return {
         parentData: 'value'
       };
     }
   }
   </script>
   

   在这个例子中，dynamicProp 是一个动态prop，其值会随着 parentData 的变化而变化。

2. 动态属性名称：使用方括号 [] 将属性名作为一个表达式来动态确定传递的属性名。例如：

   <template>
     <child-component :[dynamicAttr]="propValue"></child-component>
   </template>
   
   <script>
   export default {
     data() {
       return {
         dynamicAttr: 'dynamicProp',
         propValue: 'value'
       };
     }
   }
   </script>
   

   在这个例子中，[dynamicAttr] 是一个动态的属性名，其值由 dynamicAttr 变量决定。

动态prop的使用使得在不同情况下能够动态地传递不同的值给组件，从而增强了组件的灵活性和可复用性。