Question

我正在渲染对象列表，并且一切正常。

但是现在我想将图片添加到对象数组中，但是似乎无法渲染图片。

我已导入所述图片。

我的数组如下所示：

       Import image from ‘./rusty.jpg’ ;

Class dogList extends Component{
  Constructor (props){
     Super(props);

  this.state={
    dogs: [
      {Name: ‘rusty’, sex:’male’, age:10, image:{image}},
      {Name: ‘rusty’, sex:’male’, age:10, image:{image}},
      {Name: ‘rusty’, sex:’male’, age:10, image:{image}},
       ]
     }
  }

等等...

我知道我的导入很好，因为我尝试将其渲染到其他地方并且可以正常工作。我可以肯定我的错误是在状态中。我还尝试过将它作为组件放置在其中

<img src={image}/>

但是没有一个工作

非常感谢您的帮助

Answer 1

取下花括号：

{Name: ‘rusty’, sex:’male’, age:10, image: image},

在ES6中，您甚至可以删除分号：

{Name: ‘rusty’, sex:’male’, age:10, image},

渲染时，将其作为src属性传递到img标签：

<img src={ dog.image } />

渲染包括图片的列表

1 个答案: