avue-crud 可编辑
参考官方文档: 配置数据中【$cellEdit为true】即可开启首次编辑addRowBtn为行新增按钮,cellBtn设置为true则开启行编辑按钮,在配置中将编辑的字段设置【cell为true】,增删改查方法和crud组件使用一致,rowKey为主键的key,如果数据中存在主键,数据才会保存在表格中。个人实验下来,只有两步 1、Json数据中每个元素加上:$cellEdit:true如:{
·
参考官方文档:
配置【数据中 $cellEdit为true】即可开启首次编辑addRowBtn为行新增按钮,cellBtn设置为true则开启行编辑按钮,在配置中将【编辑的字段设置 cell为true】,增删改查方法和crud组件使用一致,rowKey为主键的key,如果数据中存在主键,数据才会保存在表格中。
个人实验下来,只有两步
1、Json数据中每个元素加上:$cellEdit:true
如:
{
id:0,
sex:1,
age:18,
$cellEdit:true // 可编辑
},{
id:1,
name:'李四',
age:18,
sex:0, // 不可编辑
}
2、option 中的 column,在想要编辑的字段加上:cell: true,
column: [{
label:'姓名',
prop: 'name',
cell: true, // 设为true
rules: [
{
required: true,
message: '请输入姓名',
trigger: 'blur'
}
]
}]
问题来了,后端传来的json怎么办?如何在每个json元素中加上$cellEdit:true
可以利用forEach
res.data.gssalSalPodelayanDtla.forEach((item) => {
item.$cellEdit = true
})
如此 res.data.gssalSalPodelayanDtla 中的每一个元素就多了$cellEdit:true
更多推荐
已为社区贡献4条内容
所有评论(0)