2021-08-17

elementUI表格点击单元格弹出dialog选择颜色，改变单元格颜色

在表格头部添加cell-click方法，当某个单元格被点击是触发该方法
<el-table :data=“tableData” border :cell-style=“tableCellStyle”
:header-cell-style="{‘text-align’:‘center’}" @cell-click=“cel”>

写一个dialog，点击单元格弹出颜色选择按钮，选择不同颜色的按钮改变单元格颜色
HTML：

JS：
data() {
return(){
dialogTableVisible: false
},
methods:{
cel(row,column,cell,event){
this.cell=cell
},
exchangestate1() {
console.log(this.cell)
this.cell.style.background=“green”
this.dialogTableVisible = false;
},
exchangestate2() {
this.cell.style.background=“orange”
this.dialogTableVisible = false;
},
exchangestate3() {
this.cell.style.background=“red”
this.dialogTableVisible = false;
}
}