写一个vue代码关于如何用props让父组件控制子组件的属性

当父组件需要控制子组件的属性时，可以通过props来实现。在父组件中定义一个属性，然后将子组件所需的属性传递给该属性。例如：

// 父组件
<template>
  <div>
    <ChildComponent :prop1="parentProp1" :prop2="parentProp2" />
  </div>
</template>

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

export default {
  components: {
    ChildComponent
  },
  data() {
    return {
      parentProp1: '',
      parentProp2: ''
    };
  }
}
</script>

// 子组件
<template>
  <div>
    {{ prop1 }}
    {{ prop2 }}
  </div>
</template>

<script>
export default {
  props: {
    prop1: {
      type: String,
      default: ''
    },
    prop2: {
      type: Number,
      default: 0
    }
  }
};
</script>

在父组件中通过:prop1和:prop2绑定子组件的属性，然后将属性传递给子组件。在子组件中定义props，然后通过props获取相应的属性。这样父组件就可以控制子组件的属性了。