ant design vue中表格指定格式渲染

注意点：定义的columns一定要写在data中，否则在加载过程中由于渲染顺序会导致其中的渲染函数无法识别

渲染方法1：

指定渲染函数：

const columns = [
      {
        title: '排名',
        dataIndex: 'key',
        customRender: renderContent // 渲染函数的规则
      }, {
        title: '搜索关键词',
        dataIndex: 'keyword',
        customRender: (text, row, index) => {
            if (index < 4) { // 前4行数据以a标签的形式被渲染
              return <a href="javascript:;">{text}</a>
            }
            return { // 否则以独占4列的文本形式被渲染
              children: text,
              attrs: {
                colSpan: 4
              }
            }
        }
      }
]
const renderContent = (value, row, index) => {
  const obj = {
    children: value,
    attrs: {}
  }
  return obj
}

渲染方法2：

直接调用对应插槽模板：

<a-table :columns="columns" :dataSo