vue3中父传子props动态传参对象

在 Vue 3 中，父组件通过 props 向子组件传递数据时，可以动态地传入一个对象作为参数。这种情况下，通常使用 `v-bind` 或者简写的 `:` 连接键值对，并配合表达式来改变对象的内容。例如：

<template>
  <child-component :myProps="dynamicObject"></child-component>
</template>

<script>
export default {
  data() {
    return {
      dynamicObject: { key1: 'value1', key2: 'value2' } // 初始值
    };
  },
  // 当需要更新对象时，可以在 methods、watch 或 computed 中操作
  methods: {
    updateDynamicObject() {
      this.dynamicObject = { key3: 'newValue', key4: 'anotherValue' };
    }
  }
};
</script>

在这个例子中，`dynamicObject` 是一个动态的对象，你可以随时通过 `updateDynamicObject` 方法或者其他计算属性来改变它的内容。然后你在子组件 `<child-component>` 中可以直接访问这个 prop。