7、如何在表格中插入圖片？

方法：通過作用域插槽,根據圖片id,動態解析圖片地址

完整案例：
tableCom組件：
<a-table :rowKey="(record,index)=>{return index}" :columns="columns" :data-source="data" :pagination="pagination" :scroll="scroll" >
     //此處是重點
      <div slot="photo" slot-scope="text">
        <img :src="photoSrc(text)" alt="" srcset="" style="width:60px;height:80px">
      </div>
      
      <span slot="escortWayScopedSlots" slot-scope="text">
        {{ 'yaJieFangShi' | dictType(text) }}
      </span>
          
</a-table>

data(){
    return{
      //拼接圖片地址
      photoSrc:(text)=>{           
        return process.env.VUE_APP_API_BASE_URL+'/sysFileInfo/preview?id='+text
      }
    }
},

TimeTaskLogin.vue:
import tableCom from '@/components/work/tableCom.vue'

components: {
    tableCom,
},
data(){
  return{
     columns1: [
        {
          title: '姓名',
          dataIndex: 'policeName',
          key: 'policeName',
          align: 'center',
          width: 120,
        },
        {
          title: '照片',
          dataIndex: 'poliecePhoto',
          key: 'poliecePhoto',
          //作用域插槽
          scopedSlots: { customRender: 'photo' },
          align: 'center',
          width: 120,
        },          
      ],
  }
}