if (this.form.scope1 && this.form.scope2) { this.form.scope = this.form.scope1 + '.' + this.form.scope2 delete this.form.scope2 && delete this.form.scope1 } else if (this.form.scope1 && !this.form.scope2) { return this.$message.error('取值范围请输入完整'); } else if (!this.form.scope1 && this.form.scope2) { return this.$message.error('取值范围请输入完整'); } 优化代码
时间: 2024-01-30 18:03:41 浏览: 62
可以将第一个 if 语句块中的 delete 操作移到 if 语句块外,同时将第二个和第三个 if 语句块合并为一个。优化后的代码如下:
```
if (this.form.scope1 && this.form.scope2) {
this.form.scope = this.form.scope1 + '.' + this.form.scope2;
delete this.form.scope2;
delete this.form.scope1;
} else if (!this.form.scope1 || !this.form.scope2) {
return this.$message.error('取值范围请输入完整');
}
```
这样可以使代码更加简洁和易读。
相关问题
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` 拼接成一个完整的字符串,以便后端处理。
<el-button class="buttonInfo" size="small" @click="updataMethod(scope.$index,scope.row)">编辑</el-button>updataMethod(index, rowData) { this.dialogEdittVisible = true this.$nextTick(() => { this.dialogType = 'editProjectOne' this.formEditTitle = '编辑' this.formEdit = Object.assign({}, rowData) this.getMbsj() }) }, getTarget() { if (this.formList.indexName == null || this.formList.indexName == '') { this.$message('请选择分项') return false } if (this.itemize == null || this.itemize == '') { this.$message('请选择总量') return false } this.$ajax({ url: '/lims/projectLib/project_item', method: 'post', data: { name: this.formList.indexName, tableData: this.selectedData, }, }).then(res => { if (res.data.code === 200) { this.$message({ message: '添加成功', center: true, type: 'success', }) this.dialogEdittVisible = false this.getList() } else { this.$message({ message: res.data.msg, center: true, type: 'error', }) this.dialogEdittVisible = false } }) },点击编辑按钮时如何显示编辑之前的数据
根据你提供的代码,可以看出编辑按钮点击后会触发 `updataMethod` 方法,该方法会将 `dialogEdittVisible` 设置为 `true`,从而显示编辑弹窗。同时,会将 `formEdit` 对象赋值为当前行数据的拷贝,用于编辑之前的数据展示。
你可以在弹窗中使用 `formEdit` 对象的属性来展示编辑之前的数据。例如,在弹窗中展示名称可以这样写:
```html
<el-form-item label="名称">
<el-input v-model="formEdit.name"></el-input>
</el-form-item>
```
这里假设当前行数据对象中有一个名为 `name` 的属性。你可以根据实际情况调整代码。
阅读全文