Reactjs 변수를 이미지 및 링크 태그에 전달

Question

아래 코드를 사용하여 레코드를 표시했습니다. 하지만 내 현재 문제는 내가 아래의 코드 라인 당 이미지 태그와 링크 태그에 reactjs 값을 전달할 수 없다는 것입니다.

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

은 당신이 ES6 환경을 사용하는 경우

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

, 당신은 템플릿을 그대로 사용할 수있는 가장 좋은 방법이 될 수 있는지.

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

당신이하지 않은 경우, 당신은 문자열

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