element-ui更改单元格字体颜色

作者创建的项目为vue3+ts，写法上有些需要注意的点：

• 如果script 标签使用了 setup，这个时候 export 是没有必要的，也就是使用了setup 后，就不要再写 export 了，不然会报错“A default export must be at the top level of a file or module declaration”
• 本来想使用过滤器，但是发现vue3删掉了过滤器filter功能，官方建议：用方法调用或计算属性替换过滤器——vue3.0中为啥要删除过滤器功能，因为功能重复吧？
• vue3的插槽使用方法发生了改变，# 等同于 slot= ——vue3的slot插槽用法，slot-scope are deprecated

在插槽中使用行内样式更改一整列数据颜色

<el-table-column prop="date" label="日期" >
	<template #="scope">
	    <div style="color:#fec632">
	        {{ scope.row.date }}
	    div>
	template>
el-table-column>

使用element-ui中的tag标签

• 大部分时候表格内的数据需要用不同的颜色标注是因为数据有不同的状态，前辈建议我用element-ui中的标签，tag标签可以自定义按钮的颜色

例子：

<el-table-column prop="status" label="状态" >
        <template #="scope">
          <el-tag
            :color="statusColor(scope.row.status)"
            style="color: #ffffff; border-color: transparent"
            size="mini"
            disable-transitions
          >
            {{ scope.row.status }}
          el-tag>
        template>
      el-table-column>

const statusColor = computed(() => {
  return function (status:string){
    switch(status){
        case "未开始":
            return "#ff4949";
            break;
        case "进行中":
            return "#ffba00";
            break;
        case "已完成":
            return "#5ccb91";
            break;
    }
  }
})

有哪些不合适的地方欢迎指正(●’◡’●)