ElementUI中table表格实现根据不同的cellValue的值渲染不同颜色的值

ElementUI官网关于table的api文档

• 根据Table-column Attributes这里的描述，如果我们需要将某个单元格的值重新渲染的话，需要使用到formatter属性来绑定一个用于格式化本单元格的函数，在函数中重新的计算并返回需要的值。
• Function(row, column, cellValue, index)
• 该函数接受4个参数：row-行数据 column-列字段属性 cellValue-本格的值 index-索引值

<el-table-column 
	prop="remainDays" 
	align="center" 
	label="距离召开时间剩余天数" 
	:formatter="formateDays">
</el-table-column>
//绑定到一个formatDays的函数上

在methods中定义下列两个函数用于格式化天数

methods:{
	//格式化天数、只格式化文本
	formateDays ( row, column, cellValue, index ) {
		let cell = parseInt(cellValue)
		return cell >= 0 ? cell : '已逾期' + Math.abs( cell ) + '天'
	},
	//格式化天数，html形式，包含颜色
	formateHtml ( row, column, cellValue, index ) {
		let cell = parseInt(cellValue)