const { data } = await attributeid(row.id) this.form = data if (data.scope && data.scope.includes('.')) { // 判断是否包含分隔符 let [left, right] = data.scope.split('.'); // 分割字符串 this.form.scope1 = left // 输出左边的内容 this.form.scope2 = right // 输出右边的内容 delete data.scope } this.dialogVisible = true <el-input-number v-model="form.scope2" :step="1"></el-input-number> 在编辑时 数据回显了 改动不了 怎么解决 代码展示

根据你提供的代码，可能的原因是在编辑时没有正确更新 `form.scope2` 的值。你可以尝试使用 `this.$forceUpdate()` 强制更新组件，或者在编辑时手动将 `form.scope2` 的值更新为用户输入的值，例如：

<el-input-number v-model="form.scope2" :step="1" @change="updateScope2"></el-input-number>

methods: {
  updateScope2(val) {
    this.form.scope2 = val;
  },
}

这样，当用户改变 `el-input-number` 的值时，会触发 `@change` 事件，调用 `updateScope2` 方法将 `form.scope2` 的值更新为新的值。这样就能确保 `form.scope2` 的值与用户输入的值同步了。

另外，如果你需要在整个表单提交时一次性获取所有的值，可以考虑将 `el-input-number` 组件改为一个普通的输入框，并将用户输入的值作为一个字符串类型的值存储在 `form.scope2` 中，例如：

<el-input v-model="form.scope2" type="text"></el-input>

这样，当整个表单提交时，你可以将 `form.scope1` 和 `form.scope2` 拼接成一个完整的字符串，以便后端处理。

相关问题

const data = this.$commonUtil.deepClone(this.form)

这段代码的作用是深拷贝一个对象，将 `this.form` 对象的所有属性和属性值复制到一个新的对象 `data` 中，并且 `data` 与 `this.form` 完全独立，修改 `data` 不会影响 `this.form`，反之亦然。这个函数是使用了一个常用的 JavaScript 技巧——递归。递归指的是函数调用自身的技术，当遇到对象或数组等引用类型时，递归调用自身，将其子元素也进行递归复制。这样可以确保深拷贝的所有引用类型都是独立的。

const { data } = await attributeid(row.id) this.form = data if (data.scope && data.scope.includes('.')) { // 判断是否包含分隔符 let [left, right] = data.scope.split('.'); // 分割字符串 this.form.scope1 = left // 输出左边的内容 this.form.scope2 = right // 输出右边的内容 delete data.scope } this.dialogVisible = true <el-input-number v-model="form.scope2" :step="1"></el-input-number> 在编辑时 数据回显 点击两边的加减不动 怎么解决 代码展示

根据你提供的代码，可能的原因是你使用了 `delete data.scope` 语句删除了 `data.scope` 字段，但是 `el-input-number` 组件的 `v-model` 绑定的是 `form.scope2`，所以当你在编辑时点击加减按钮时，实际上是在修改 `form.scope2` 的值，而该值已经不再存在了，导致无法修改。

解决这个问题的方法是，在删除 `data.scope` 前，先将其值赋给 `form.scope2`，例如：

const { data } = await attributeid(row.id);
this.form = data;
if (data.scope && data.scope.includes('.')) {
  let [left, right] = data.scope.split('.');
  this.form.scope1 = left;
  this.form.scope2 = right;
  // 将 data.scope 的值赋给 form.scope2
  this.form.scope2Value = data.scope;
}
this.dialogVisible = true;

然后在模板中，将 `v-model` 绑定到 `form.scope2Value` 上，例如：

<el-input-number v-model="form.scope2Value" :step="1"></el-input-number>

这样，当用户点击加减按钮时，实际上是在修改 `form.scope2Value` 的值，而不是 `form.scope2` 的值。在提交表单时，你可以将 `form.scope1` 和 `form.scope2Value` 拼接成一个完整的字符串，以便后端处理。