將Reactjs變量傳遞給圖像和鏈接標記

Question

我使用下面的代碼來顯示記錄。但我目前的問題是，我無法按照以下代碼行將reactjs值傳遞給Image標記和鏈接標記。

<img src=/uploads/{item.pic}></img> 
<a href="data.php?id={item.link}" tittle="">Next</a> 

什麼可以做

class App extends React.Component { 
    constructor(){ 
    super() 
     this.state = { 
     data: [] 
     } 

    } 
    componentDidMount() { 
    $.ajax({ 
     url: "jeck.php", 
     type: "GET", 
     success: function(data) { 

     this.setState({data: data}); 
     }.bind(this), 
     error: function(jqXHR) { 
     console.log(jqXHR); 
     }.bind(this) 
    }) 
    } 
    render() { 
    return (
     <div> 
     {this.state.data.map(function(item, key) { 
      return (
      <li key={key}> 
       {item.name} 
       {item.id} 
       {item.pic} 
       {item.link} 
       <img src=/uploads/{item.pic}></img> 
       <a href="data.php?id={item.link}" tittle="">Next</a> 
      </li> 
     ); 
     })} 
    </div> 
    ); 
    } 
} 

Answer 1

如果您使用的是ES6環境中，可以使用模板文字的最佳途徑。

<img src={`/uploads/${item.pic}`}></img> 

如果你沒有，你可以將字符串

<img src={'/uploads/' + item.pic}></img>