如何在 React 虚拟化库表的列中添加图像

Question

如何在 React 虚拟化库表的列中插入图像， 我已经尝试添加列的 dataKey 属性，但它没有加载，有什么解决办法

import React, { Component } from 'react';
import { Column, Table, AutoSizer, Grid } from 'react-virtualized';

class TableComponent extends Component{
	state={
		callLogsColumnsData: null
	}
	componentDidMount(){
		this.setState({callLogsColumnsData: this.props.tableData});
	}
	render(){
		return(
			<Table
				sortBy="rank"
				sortDirection="DESC"
				width={width}
				height={820}
				headerHeight={20}
				rowHeight={60}
				headerClassName='call-logs-table-header'
				rowClassName='call-logs-row-table'
				style={{borderBottom: "solid 1px #000"}}
				onRowClick={this.onRowClick}
				rowCount={this.state.callLogsColumnsData.length}
				rowGetter={({ index }) => this.state.callLogsColumnsData[index]}
			>
				<Column
					label='CALL ID'
					dataKey='callId'
					width={100}
					className="table-column"
				/>
			</Table>
		)
	}
}
export default TableComponent;

Answer 1

< Column
width = {
  130
}
label = 'CLI LOCATION'
dataKey = 'cliLocation'
cellData = ''
cellRenderer = {
  this.cliLocationColumnData
}
/>

cliLocationColumnData = ({
  cellData,
  dataKey
}) => {
  return ( <
    div >
    <
    img src = {
      GB_FLAG
    }
    alt = 'imageName' / >
    <
    span > {
      dataKey
    } < /span> <
    /div>
  )
}