动态显示图像

时间:2018-11-30 17:29:29

标签: reactjs

我无法动态显示图像。我正在使用axios从后端提取数据。 在app.js页面上,需要通过从状态循环显示每个图像。 我认为``应该可以完成工作,但是由于某种原因会出现此错误

提前thnx!

error screen

app.js文件

componentDidMount () {
    axios.get('http://localhost:8888/marwan4.0/php_react/api/Recepie/read.php')

    .then(response => {
      this.setState({recep: response.data.recepies});
    });
  }

render() {
    const recepies = this.state.recep.map(post => {
      return <Recep 
              key={post.img_id}
              name={post.name} 
              img={post.image}
              />
    }
    )

Recep.js文件

<div className={[classes.Card, "card"].join(' ')} id={props.id}>
         <img className="card-img-top" src={require(`../../assets/img/${props.img}`)} alt="Card image cap"></img>
         <div className="card-body">
            <h5 className="card-title">{props.name}</h5>
            <p className="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
            <a href="#" className="btn btn-primary">Go somewhere</a>
         </div>
      </div>

0 个答案:

没有答案