javascript - 尝试从 create-react-app 中的 .json 文件中读取图像

Question

我正在尝试将图像从我的 .json 文件加载到我的组件中，但图像没有加载。

Someone looks to have solved it, but I don't know what he is talking about in terms of "branching"

  "Bumper": [{
      "id": 1,
      "productSquareId": "BumperStubby",
      "productImage": "bumper",
      "companyImage": "logo.png",
      "price": "$55.99"
    },

const image1 = ProductInformation.Bumper[0].companyImage;
<img  className = "MainImage" src ={image1}/>

我的图像与我的组件位于同一文件夹(组件)中。我在这里做错了什么？感谢您的宝贵时间。

Answer 1

看起来我解决了我的问题，但是通过将我的 .json 文件变成 .js 文件。

<img className = "MainImage" src ={bumper[0].productImage}/>

export const bumper = [
  {
    id: 1,
    productSquareId: 'BumperStubby',
    productImage: require('./bumper1.png'),
    companyImage: require('./logo.png'),
    price: '$55.99',

  }
]

使用 .js 文件与使用 .json 文件在性能上有什么不同吗？