不需要在 CRA 中加载图像

编程问答 2022-05-31

问题描述

嗨

我目前正在尝试在 React 中显示列表元素，但我无法使用 require 加载图像。
我正在使用 CRA 并且没有更改 webpack.config.js。

列表

import img1 from "../../assets/work-in-progress.png";

const projects = [
    {
        id: 1,image_path: img1,title: "t1",category: "testing"
    },{
        id: 2,image_path: require("../../assets/work-in-progress.png"),title: "t2",]

我如何显示图像

<img src={ entry.image_path } alt="Project's" className="rounded" />

目前，第一张图片显示正确，但第二张图片无法加载。

我已经尝试使用 src={ "" + entry.image_path } 并得到了相同的结果。

解决方法

我认为您的路径不正确。它对我有用。这是有效的 code

reactjsreactjsrequirerequiretypescripttypescript