iview-admin二次开发,表格直接用自带的tables组件
实现效果图
点击后数据库会直接修改认证字段的值
参考
一、前端
{
title: "是否认证",
key: "authentication",
width: "100px",
render: (h, params) => {
return h("i-switch", {
props: {
value: params.row.authentication === 1,
size: "large"
},
on: {
"on-change": value => {
//触发事件是on-change,用双引号括起来,
//参数value是回调值,并没有使用到
this.switch(params.index); //params.index是拿到table的行序列,可以取到对应的表格值
}
}
});
}
},
方法
switch(index) {
//打开是true,已经处理1
if (this.invoices[index].authentication == 1) {
axios.get("http://localhost:8080/invoice/updateA0", {
params: { invoicecodeleft: this.invoices[index].invoicecodeleft }
});
this.invoices[index].authentication = 0
} else {
axios.get("http://localhost:8080/invoice/updateA1", {
params: { invoicecodeleft: this.invoices[index].invoicecodeleft }
});
this.invoices[index].authentication = 1
}
},
invoicecodeleft 是我这个表的主键,根据此字段查找更改
二、后端
@Update("update invoice set Authentication=0 where InvoiceCodeLeft=#{invoicecodeleft}")
void updateA0(String invoicecodeleft);
@Update("update invoice set Authentication=1 where InvoiceCodeLeft=#{invoicecodeleft}")
void updateA1(String invoicecodeleft);
数据库Authentication为Integer