作出反應 - 合併2串獲得URL

我如何加入一個鏈接http://image.tmdb.org/t/p/w185/和{} item.backdrop_path，提供鏈接的其他人呢？比如到底應該看起來像：http://image.tmdb.org/t/p/w185/bcRFf5Qmw4XotFYAfj8fCS8PJy5.jpg 作出反應 - 合併2串獲得URL

這是代碼本身：

export default class MoviesSearch extends Component { 
    render() { 
    const {movieprop} = this.props; 

    return (
     <ul className = "col-md-4 list-group"> 
     { 
      movieprop && movieprop.slice(0,5).map((item) => 
      <li key={item.id}> 
      <h4>name:{item.title }</h4> 
      <p>release date: {item.release_date}</p> 
      <p>vote: {item.vote_average}</p> 
      <img src="http://image.tmdb.org/t/p/w185{item.backdrop_path}"/> //NOT WORKING 
      </li> 
     ) 
     } 
     </ul> 
    ) 
    } 
}

現在它工作正常標題，發佈日期和投票，但我不能得到的URL。數據來自themoviedb： http://api.themoviedb.org/3/discover/movie?certification_country=US&certification=R&sort_by=vote_average.desc&api_key=79eb5f868743610d9bddd40d274eb15d

請讓我知道如果我的解釋是可怕的，我需要提供更多的信息。

來源

2017-06-01 Polina

您正在尋找來連接在JSX一個字符串？具體方法如下：

<img src={"http://image.tmdb.org/t/p/w185" + item.backdrop_path} />

另外，在ES6你可以使用Template Literals，像這樣：

<img src={`http://image.tmdb.org/t/p/w185${item.backdrop_path}`} />

結果的一個簡單的演示，here。（檢查元素，查看src網址。）

來源

2017-06-01 11:57:44 Chris

謝謝！這正是我想要的！ – Polina

作出反應 - 合併2串獲得URL

回答

相關問題