對於內含有循環鏈接呈現陣營

-1

For i As Integer = 0 To List.Count - 1 

    MyList.AppendFormat("<li><a href=""some_url/page?id={0}""><i class=""fa fa-cloud""></i> {1}</a></li>", List(i).ListId, List(i).ListLocationName) 

Next

到目前爲止，我做到了這一點代碼：

render() { 
    return (
     <div> 
      { 
      <ul className="this-nav"> 

       {this.props.list.map((value, index)=> <li><a href={"some_url/page?id=" + index}></a></li>) 

       } 

      </ul> 
      } 
     </div> 
    ); 

}

是它一個更好的方法來做到這一點？我在控制檯中得到了以下消息：

數組或迭代器中的每個子元素都應該有一個唯一的「key」屬性。檢查MyList的渲染方法。

來源

2017-07-21 Samurai Jack

一兩件事，在地圖的回調函數，你有「價值」作爲參數，但它從來沒有使用過，是故意的嗎？ –

檢查此答案[當需要在反應中]（https://stackoverflow.com/questions/43904825/what-do-curly-braces-mean-in-jsx-react）和[** React DOC ** ]（https://facebook.github.io/react/docs/introducing-jsx.html#embedding-expressions-in-jsx）瞭解如何在JSX中放置表達式。 –

[React JSX內部循環]的可能重複（https://stackoverflow.com/questions/22876978/loop-inside-react-jsx） –

試試這個：

render() { 
return (
    <div> 
     <ul className="this-nav"> 
      { 
      this.props.list.map((value, index)=> { return (<li key={`index-${index}`}><a href={ `some_url/page?id=${index}` }></a></li>); }) 
      } 
     </ul> 
    </div> 
); 
}

你有多餘的括號，也很清潔劑使用字符串插值爲「禮」鍵（需要反應）和HREF屬性

來源

2017-07-21 08:51:08

我喜歡爲了將關鍵字直接映射到地圖數組的索引，所以我不必在以後再考慮它。雖然

render() { 
 
    return (
 
     <div> 
 
      <ul className="this-nav"> 
 
       {this.props.list.map((value, index)=> { 
 
        return (
 
        <li key={index}><a href={"some_url/page?id=" + index}></a></li> 
 
       ) 
 
       } 
 
       } 
 
      </ul> 
 
     </div> 
 
    ); 
 
}

來源

2017-07-21 08:56:05 Milos

對於內含有循環鏈接呈現陣營

回答

相關問題