Vue在使用Element UI 的一些经验
1. 使用 el-table时,想要自定义 table 的hover的样式:elementUI表格动态变色问题
.el-table--enable-row-hover .el-table__body tr:hover>td {
}
2.table中想要在每行的数据定义class。 使用 row-class-name. 某一行添加 warning-row class.
<el-table :data="tableData2" style="width: 100%" :row-class-name="tableRowClassName"><el-table/>
tableRowClassName({ row, rowIndex }) {
const highlight = this.list.map((item, index) => {
if (item.isHighlight === true) {
return index
}
})
for (let i = 0; i < highlight.length; i++) {
if (rowIndex === highlight[i]) {
return 'warning-row'
}
}
},
const highlight = this.list.map((item, index) => {
if (item.isHighlight === true) {
return index
}
})
for (let i = 0; i < highlight.length; i++) {
if (rowIndex === highlight[i]) {
return 'warning-row'
}
}
},
css: .warning-row { color: red; }
3. 基于Vue+Element的表单验证 https://www.jianshu.com/p/352a4b520354