图像不会呈现在页面中。我希望Itemlist组件上的每个项目都有一个图像匹配。我只尝试了Lenovo项目

Question

这是我的ItemList组件和其余的components.All。我的组件位于App.js中，component.The映像位于与App.js组件相同的源文件夹中。

class ItemsList extends React.Component {
constructor(props) {
super(props);

this.state = {total:0,

  items: [
    {image:{require('./image.jpg')},name:"Lenovo",description:"Core i5 - 4gb ram - 256gb 
 SSD", price: 540},
    {name:"Dell",description:"Core i7 - 8gb ram - 1tb HDD",  price: 700},
    {name:"Asus",description:"Core i3 - 4gb ram - 512gb HDD",  price: 429}
    ]}

Answer 1

你可以做到的

import LenovoImage from './image.jpg';   /* or whatever image path */

class ItemsList extends React.Component {
constructor(props) {
super(props);

this.state = {total:0,

  items: [
    {image:LenovoImage,name:"Lenovo",description:"Core i5 - 4gb ram - 256gb 
 SSD", price: 540},
    {name:"Dell",description:"Core i7 - 8gb ram - 1tb HDD",  price: 700},
    {name:"Asus",description:"Core i3 - 4gb ram - 512gb HDD",  price: 429}
    ]
}