Reactjs 无法使用变量显示图像

我将图像名称存储在localstorage中

我的本地存储数据是：

Key:contact
data:[{"id":1,"name":"","query":"","image":"'./Koala.jpg'","price":""}]

我的代码在下面

  return ( 
        <React.Fragment>
            <h2>Products Cataloge.</h2>
            <div className="container" id="con">
                <div className="row">
                    {this.state.comment.map((item,index)=>(
                        <div className="col-md-4" >
                            <div className="card" id="card1" >
                                <img className="card-img-top" src={require(item.image)} alt="Card image"/>
                                <div className="card-body">
                                    <h4 className="card-title">{item.name}</h4>
                                    <Link to={`/description/${item.id}`} ><button className="btn btn-primary">View Discription</button></Link> 
                                </div>
                            </div>
                        </div>
        ))}
                </div>
           </div>
        </React.Fragment>
     );

返回（
产品目录。
{this.state.comment.map（（项，索引）=>(
{item.name}
视图描述
))}
);

对于要格式化的文件和url路径，“/path”或“/path”

通过将data.image设置为

data{image:'./Koala.jpg'}

您将返回整个字符串值

'./Koala.jpg'

，包括单引号

const data={imageGood:“./Koala.jpg”，imageBad:“'./Koala.jpg'}
console.log（'imageBad'，data.imageBad）/“'./Koala.jpg'”
console.log（'imageGood'，data.imageGood）/“/Koala.jpg”

，用于您希望格式化的文件和url路径。“/path”或“/path”

通过将data.image设置为

data{image:'./Koala.jpg'}

您将返回整个字符串值

'./Koala.jpg'

，包括单引号

const data={imageGood:“./Koala.jpg”，imageBad:“'./Koala.jpg'}
console.log（'imageBad'，data.imageBad）/“'./Koala.jpg'”
console.log（'imageGood'，data.imageGood）/“/Koala.jpg”

的代码要求（item.image）是什么样子？要求是reactjs库中的内置函数。

的代码要求（item.image）什么

look like？require是reactjs库中的内置函数。我更改了数据，但html页面上仍然没有显示IMAGE。您现在可以发布数据的外观了吗？另外，您确定图像与您要导入的文件存储在同一目录（不是子目录）中吗？我更改了数据，但html页面上仍然没有显示图像。您现在可以发布您的数据吗？另外，您是否确定图像与要导入的文件存储在同一目录（不是子目录）中？