mirror of
https://gitee.com/element-plus/element-plus.git
synced 2024-12-14 01:11:25 +08:00
0636e1e240
* style: add import lint * chore: apply eslint rules * chore: add stricter lint * chore: lint all files * auto fix * manually fix * restore build-indices.ts
62 lines
1.3 KiB
Vue
62 lines
1.3 KiB
Vue
<template>
|
|
<el-table
|
|
:data="tableData"
|
|
style="width: 100%"
|
|
:row-class-name="tableRowClassName"
|
|
>
|
|
<el-table-column prop="date" label="Date" width="180" />
|
|
<el-table-column prop="name" label="Name" width="180" />
|
|
<el-table-column prop="address" label="Address" />
|
|
</el-table>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
export default {
|
|
data() {
|
|
return {
|
|
tableData: [
|
|
{
|
|
date: '2016-05-03',
|
|
name: 'Tom',
|
|
address: 'No. 189, Grove St, Los Angeles',
|
|
},
|
|
{
|
|
date: '2016-05-02',
|
|
name: 'Tom',
|
|
address: 'No. 189, Grove St, Los Angeles',
|
|
},
|
|
{
|
|
date: '2016-05-04',
|
|
name: 'Tom',
|
|
address: 'No. 189, Grove St, Los Angeles',
|
|
},
|
|
{
|
|
date: '2016-05-01',
|
|
name: 'Tom',
|
|
address: 'No. 189, Grove St, Los Angeles',
|
|
},
|
|
],
|
|
}
|
|
},
|
|
methods: {
|
|
tableRowClassName({ row, rowIndex }) {
|
|
if (rowIndex === 1) {
|
|
return 'warning-row'
|
|
} else if (rowIndex === 3) {
|
|
return 'success-row'
|
|
}
|
|
return ''
|
|
},
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.el-table .warning-row {
|
|
--el-table-tr-background-color: var(--el-color-warning-lighter);
|
|
}
|
|
.el-table .success-row {
|
|
--el-table-tr-background-color: var(--el-color-success-lighter);
|
|
}
|
|
</style>
|