Vue父组件向子组件传递一个动态的值，子组件如何初始化状态

Vue父组件向子组件传递一个动态的值，可以通过在子组件的props选项中声明该值，然后在父组件中通过v-bind动态绑定传递该值。在子组件中，可以在mounted生命周期函数中对该值进行初始化状态。

例如，父组件中传递一个动态的值到子组件：

<template>
  <div>
    <child-component :dynamic-prop="propValue"></child-component>
  </div>
</template>
<script>
import ChildComponent from './ChildComponent.vue'
export default {
  components: {
    ChildComponent
  },
  data() {
    return {
      propValue: 'hello world'
    }
  }
}
</script>

在子组件中，可以通过props选项声明该值，并在mounted生命周期函数中初始化状态：

<template>
  <div>
    <p>{{ dynamicProp }}</p>
  </div>
</template>
<script>
export default {
  props: {
    dynamicProp: {
      type: String,
      required: true
    }
  },
  mounted() {
    this.$data.dynamicProp = this.dynamicProp
  }
}
</script>

在mounted生命周期函数中，我们将props中传递过来的dynamicProp值赋值给子组件的data中的dynamicProp属性，从而初始化了子组件的状态。