关于vue父子组件props单向流动的问题？

Question

这个formValue是父组件传过来的，但是我又在子组件内通过v-model改了fromValue，看文档说这种在子组件中改父组件的状态又是不合理的，就不知道怎么改了🤣🤣🤣，该怎么改啊？

<template>
  <el-form ref="refForm" :model="formValue" v-bind="formPropSheet">
    <div style="padding: 20px 20px 0">
      <el-form-item v-bind="item.formItemPropSheet">
        <el-input
          @change="
            item.changeType
              ? changeHandle(formValue[item.name], item.changeType)
              : () => {}
          "
          v-model="formValue[item.name]"
        ></el-input>
      </el-form-item>
    </div>
  </el-form>
</template>
<script setup lang="ts">
type PropsType = {
  formValue: IObj;
  formPropSheet: Object;
  config: Array<IObj>;
};
const props = defineProps<PropsType>();
</script>

Answer 1

可以将props接收的值放到data中作为默认值, v-model时候用data中的数据
要触发更新则使用$emit处理, 大概过程如下:

data() {
    return {
        fm: this.formVaue
    }
},
watch: {
  fm() {
        this.$emit("formValue:update", this.fm);
  }
}