antd插槽的使用 teble sole

其实现在了解的也不是特别的清楚
插槽模板在上面 这里只写了其中一个

<template slot="warningLevel" slot-scope="warningLevel">
          <span :class="setFontColor(warningLevel.level)">{{
            warningLevel.level
          }}</span>
          <!-- 模板里面直接加样式加不上去 -->
        </template>

上面slot="warningLevel"和下面的scopedSlots: { customRender: "warningLevel" },是对应起来的，根据这个确定位置

上面slot-scope="warningLevel"是放内容的地方，通过{{warningLevel.level}}把内容输出，我这里另外加了一个span的原因是直接在插槽里面加加不上去

如果下面的dataIndex: "level",没有注释，上面的内容输出直接写{{warningLevel}}就可以了
表单在下面

const columns = [
  {
    title: "预警等级",
    key: "level",
    // dataIndex: "level",
    scopedSlots: { customRender: "warningLevel" },
    align: "center",
    width: "6%",
    ellipsis: true,
  },
  {
    title: "预警",
    key: "content",
    dataIndex: "content",
    // align: "center",
    customRender: (value) => {
      const obj = {
        children: value,
        ali: {},
      };
      obj.ali.align = "left";
      return obj;
    },
  },
];