table单元格背景颜色、行颜色
可根据条件设置某个单元格或者整行颜色
[vue3代码]写在生成的[表.vue]文件中,[vue2代码]写在[表.jsx]文件methods方法中；二选一实现
vue3代码
//生成对象属性初始化
const onInit = async ($vm) => {
gridRef = $vm
//设置某个单元格背景颜色
columns.forEach((x) => {
if (x.field == 'ProductCode') {
x.cellStyle = (row, rowIndex, columnIndex) => {
//判断条件
if (row.ProductCode == '10044464880643') {
return { background: '#ddecfd' };
} else {
return { background: '#eee' };
}
};
}
});
//根据行的某个值设置整行颜色
columns.forEach((x) => {
x.cellStyle = (row, rowIndex, columnIndex) => {
//判断条件
if (row.ProductCode == '10044464880643') {
return { background: '#ddecfd' };
}
};
});
}
vue2 代码
onInit() {
//设置某个单元格背景颜色
this.columns.forEach((x) => {
if (x.field == 'ProductCode') {
x.cellStyle = (row, rowIndex, columnIndex) => {
//判断条件
if (row.ProductCode == '10044464880643') {
return { background: '#ddecfd' };
} else {
return { background: '#eee' };
}
};
}
});
//根据行的某个值设置整行颜色
this.columns.forEach((x) => {
x.cellStyle = (row, rowIndex, columnIndex) => {
//判断条件
if (row.ProductCode == '10044464880643') {
return { background: '#ddecfd' };
}
};
});
}