如何在React Virtualized库表的列中添加图像

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>
  )
}