React.js傳遞多個JSON值到一個子參數

Question

我有一個JSON對象：

「標籤」： 「鮭魚」， 「kitchenaccident」]

而且我有一個組件通過JSON解析..

var entryNodes = this.props.data.data.map(function(entry) { 
     return (
     <EntryComponent 
      id={entry.user.id} 
      img={entry.images.thumbnail.url} 
      likes={entry.likes.count} 
      link={entry.link} 
      username={entry.user.username} 
      caption={entry.caption.text} 
      tag={entry.tags}/> 
     ); 

但是，它將其作爲一個級聯字符串傳遞：salmonskitchenaccident。

如果我想讓它渲染爲'#salmons #kitchenaccident'..什麼是最好的解決方案。

var EntryComponent = React.createClass({ 
render: function() { 
    return(
      <div className="entry"> 
       <div className="entry-left"> 
        <img className="img-rounded" src={this.props.img} /> 
        <div className="like-section"> 
         <img className="heart" src="./img/heart.png" /> 
         <span className="likes">{this.props.likes}</span> 
        </div> 
       </div> 
       <div className="entry-right"> 
        <h4><a href={this.props.link}>{this.props.username}</a> </h4> 
        <p>{this.props.caption}</p> 
        <p className="hash">{this.props.tag}</p> 
       </div> 
      </div> 
     ); 
    } 
}); 

Answer 1

在這一行：

<p className="hash">{this.props.tag}</p>

試圖顯示陣列直線距離，其隱含的調用tags陣列的toString()方法。您需要map您的數組中的項目爲HTML節點，就像這樣：

<p className="hash">{this.props.tag.map(tag => (<span>{ '#' + tag }</span>) }</p>