Question

考虑以下代码：

    {Object.keys(data).map((key) => 
        <div className="card">
        <img 
          id={ data[key].id }
          src={this.image} // 
          className="img-card-top"
          style={{height:"14rem"}} 
          alt="recipe"
         />
    }

因此，我要从<img>中获取id={ data[key].id }并传递给图像功能

    image(id){
          // const id = this.state.data.id;
          fetch(`http://localhost:9000/api/item/photo/view/${id}`,)
          .then((resp)=>{
            resp.json().then((res)=>{
             console.log(res);
             this.setState({data: res.data});}
            )
            // console.log(this.state.data)
          })
        }

因此，我从id获得的<img>将传递到fetch中的image() API。正确的方法是什么？

Answer 1

只需将动态网址用作src，而无需使用fetch(url)

{Object.keys(data).map((key) => 
  <div className="card">
    <img 
        id={ data[key].id }
        src={`http://localhost:9000/api/item/photo/view/${id}`} 
        className="img-card-top"
        style={{height:"14rem"}} 
        alt="recipe"
    />
  </div>
)}

如何从<img>获取值并传递给函数？

1 个答案: