<el-button class="buttonInfo" size="small" @click="updataMethod(scope.$index,scope.row)">编辑</el-button> handleSave() { this.$confirm('请确认无误?', '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning', }).then(() => { if (this.dialogType == 'addProjectOne') { this.getTarget() } else if (this.dialogType == 'editProjectOne') { this.updateTarget() } else { this.$message({ message: '操作异常', type: 'error' }) } }).catch(() => { this.$message({ type: 'info', message: '取消操作' }) }) }, // 编辑 updateTarget() { if (this.formList.indexName == '' || this.formList.indexName == null) { this.$message('请选择分项') return false } if (this.itemize == null || this.itemize == '') { this.$message('请选择总量') return false } this.$ajax({ url: '/lims/projectLib/project_item', method: 'put', 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 } }) },如果点击编辑按钮时它显示后端所保存的内容怎么实现
时间: 2023-07-15 20:15:36 浏览: 123
您需要在编辑按钮的点击事件中添加获取后端保存内容的代码,然后将获取到的内容赋值给对应的表单字段。具体实现方式取决于您的后端接口返回的数据格式和前端框架。一般来说,您可以在获取到后端数据后使用双向绑定将数据绑定到表单字段上,例如使用 Vue 框架可以使用 `v-model` 来实现双向绑定。例如:
```
updataMethod(index, row) {
// 发送请求获取后端保存的数据
this.$ajax({
url: '/api/getData',
method: 'get',
params: { id: row.id }
}).then(res => {
if (res.data.code === 200) {
// 将后端数据赋值给表单字段
this.formList.indexName = res.data.data.indexName
this.itemize = res.data.data.itemize
// 显示编辑对话框
this.dialogType = 'editProjectOne'
this.dialogEdittVisible = true
}
})
},
```
这里假设后端接口返回的数据格式为 `{ code: 200, data: { indexName: 'xxx', itemize: 'yyy' } }`,并且表单中的分项字段为 `formList.indexName`,总量字段为 `itemize`。在获取到后端数据后,将分项和总量字段分别赋值即可。
阅读全文