Ant Design of Vue中table的列表中显示图片

<template>
  
  <a-card :bordered="false">
    <s-table
      ref="table"
      size="default"
      bordered
      rowKey="examId"
      :columns="columns"
      :data="loadData"
      dataPath="informationList"
      showPagination="auto"
    >
    //展示图片
      <span slot="pic" slot-scope="text, record">
        <img style="width:50px;heigth:50px" :src="record.informationThumb" />
      </span>
     <span slot="action" slot-scope="text, record">
        <template>
          <a @click="modification(record)">修改</a>
          <a-divider type="vertical" />
          <a @click="close(record)" v-if="record.publishStatus == 1">关闭</a>

          <a-popconfirm
            title="确定要发布？"
            @confirm="handlePush(record)"
            okText="确定"
            cancelText="取消"
            v-if="record.publishStatus == 0"
          >
            <a herf="#" v-if="record.publishStatus == 0">发布</a>
          </a-popconfirm>
        </template>
      </span>
    </s-table>
    <addConsult ref="addConsult" @ok="handleOk" />
  </a-card>
</template>

<script>
import { STable, Ellipsis } from '@/components'
import { ERR_OK } from '@/utils/util'
import mixinCodeList from '@/utils/mixinCodeList'
export default {
  name: 'CarList',
  mixins: [mixinCodeList],
  components: {
    STable,
    Ellipsis 
  },
  data() {
    return {
      createValue: [],
      mdl: {},
      // 查询参数
      queryParam: {},
      // 表头
      columns: [
        {
          title: '标题',
          dataIndex: 'informationTitle'
        },
        {
          title: '标题图片',
          dataIndex: 'informationThumb',
          scopedSlots: { customRender: 'pic' }
        },
        {
          title: '频道',
          // dataIndex: 'updataTime'
          scopedSlots: { customRender: 'informationType' }
          // sorter: true
        },
        {
          title: '种类',
          dataIndex: 'updataTime'
          // sorter: true
        },
        {
          title: '阅读',
          dataIndex: 'readCnt'
        },
        {
          title: '点赞',
          dataIndex: 'praiseCnt'
          // scopedSlots: { customRender: 'status' }
        },

        {
          title: '评论',
          dataIndex: 'commentCnt'
          // sorter: true
        },
        {
          title: '置顶',
          scopedSlots: { customRender: 'stickStatus' }
        },

        {
          title: '发布状态',
          // dataIndex: 'publishStatus'
          scopedSlots: { customRender: 'publishStatus' }
          // sorter: true
        },
        {
          title: '操作',
          dataIndex: 'action',
          width: '150px',
          scopedSlots: { customRender: 'action' }
        }
      ],
      parameter: null,
      // 加载数据方法 必须为 Promise 对象
      loadData: parameter => {
        this.parameter = parameter
        // console.log(Object.assign(parameter, this.queryParam))
        return getInformationListByPage(Object.assign(parameter, this.queryParam)).then(res => {
          if (res.errorCode === ERR_OK) {
            console.log(res)
            return res
          }
        })
      },
      informationStateList: [
        {
          id: '1',
          text: '发布'
        },
        {
          id: '0',
          text: '关闭'
        }
      ],
      kindType: [
        {
          id: '1',
          text: '图文'
        },
        {
          id: '2',
          text: '视频'
        }
      ],
      channelType: [
        {
          id: '1',
          text: '医护'
        },
        {
          id: '2',
          text: '婴儿'
        }
      ],
      stickType: [
        {
          id: '1',
          text: '置顶'
        },
        {
          id: '0',
          text: '未置顶'
        }
      ]
    }
  },


}