vue 动态更改columnDefs某一列字体颜色
时间: 2023-02-07 10:32:46 浏览: 111
可以使用 Vue.set 或者 $set 在动态更新列的定义时更新某一列的样式。
例如:
```
let columnDefs = [
{ field: "name", displayName: "Name" },
{ field: "age", displayName: "Age" }
];
Vue.set(columnDefs[0], 'style', { color: 'red' });
// 或者
this.$set(columnDefs[0], 'style', { color: 'red' });
```
然后,您可以在渲染列时使用这些样式:
```
<template>
<div>
<table>
<thead>
<tr>
<th v-for="column in columnDefs" :style="column.style">{{ column.displayName }}</th>
</tr>
</thead>
<tbody>
<!-- ... -->
</tbody>
</table>
</div>
</template>
<script>
export default {
data() {
return {
columnDefs: [
{ field: "name", displayName: "Name", style: { color: 'red' } },
{ field: "age", displayName: "Age" }
]
};
}
};
</script>
```
希望这能帮到您!
阅读全文