<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() }) },点击按钮怎么回显数据
时间: 2023-07-16 20:14:26 浏览: 94
点击按钮出数据集
根据你提供的代码片段,可以看出点击`编辑`按钮后会调用`updataMethod`方法,并将当前行的数据作为参数传递进去。在`updataMethod`方法中,会将`dialogEdittVisible`属性设置为`true`,显示一个弹窗。
在弹窗中,会根据`dialogType`属性的值来判断是编辑还是新增操作。如果是编辑操作,那么会将`formEditTitle`属性设置为`编辑`。然后通过`Object.assign()`方法,将当前行的数据赋值到`formEdit`对象中,以便在弹窗中渲染出当前行的数据。最后会调用`getMbsj`方法,获取一些必要的数据。
因此,在弹窗中显示当前行数据的代码应该是在`<template>`标签中,使用`v-model`指令绑定表单元素的值,如下所示:
```html
<template>
<el-dialog :visible.sync="dialogEdittVisible">
<el-form :model="formEdit">
<el-form-item label="标题">
<el-input v-model="formEdit.title"></el-input>
</el-form-item>
<el-form-item label="内容">
<el-input v-model="formEdit.content"></el-input>
</el-form-item>
<!-- 其它表单元素 -->
</el-form>
</el-dialog>
</template>
```
这样,打开弹窗后,表单中的`标题`和`内容`输入框中就会显示当前行的数据。当用户修改数据后,点击保存按钮即可将修改后的数据提交到后端。
阅读全文