Vue里如何解决form吧表单更新操作出现不能进行编辑的情况

只需在进行form表单更新操作的时候进行强制更新即可:
1、首先、定义一个用于强制更新的方法

//对form表单进行强制更新操作,避免无法编辑表单的情况
    updateForce(e){
      this.$forceUpdate();
      var val = e;
    }

2、在需要进行更新操作的form表单调用定义好的强制更新方法

<el-form-item label="线路编号" :label-width="formLabelWidth" prop="routeId">
                <el-input v-model.number="form.routeId" clearable @input="updateForce($event)" placeholder="请输入线路编号"/>
              </el-form-item>
              <el-form-item label="上行终点站" :label-width="formLabelWidth" prop="upExplain">
                <el-input v-model="form.upExplain" clearable @input="updateForce($event)" placeholder="请输入上行终点站"/>
              </el-form-item>
              <el-form-item label="下行终点站" :label-width="formLabelWidth" prop="downExplain">
                <el-input v-model="form.downExplain" clearable @input="updateForce($event)" placeholder="请输入下行终点站"/>
              </el-form-item>

3、更新操作完成的提交操作也需要进行表单的强制更新操作,加入下面的代码段即可

this.$forceUpdate();

通过上述操作、即可解决遇到的form表单更新操作无法编辑的情况。

Logo

前往低代码交流专区

更多推荐