antdesign +vue 的table中使用 customRender

Ant Design Vue 中的 Table 组件提供了一个 `customRender` 属性，用于自定义表格列的渲染内容。这个功能允许开发者根据需要对特定列的数据进行格式化、展示复杂组件或者动态计算值。

当你想要在 Ant Design 的 Table 中使用 `customRender` 时，通常会在 `columns` 数组配置中指定每个列。例如：

<template>
  <a-table :columns="columns" :data-source="dataSource">
    <!-- 其他表头和数据部分 -->
  </a-table>
</template>

<script>
export default {
  components: {},
  data() {
    return {
      columns: [
        {
          title: '姓名',
          dataIndex: 'name', // 数据字段名
          render: (text, record) => { // 使用 customRender 自定义渲染
            return `<span>${record.name}</span>`; // 文本形式
            // 或者返回 JSX 渲染其他组件
            return <div>{/* 这里可以放任意Vue组件 */}</div>;
          }
        },
        // 更多列...
      ],
      dataSource: [], // 表格数据源
    };
  },
  // ...
};
</script>

在这个例子中，`customRender` 函数接收两个参数：当前行的数据 (`text`) 和完整的记录 (`record`)，然后返回你要显示的内容。