ReactJS;導航到「動態」數據生成的新頁面？

所以我有主頁，其中介紹了很多項目。我打算讓每個項目都是可點擊的，這會將您帶到項目頁面。需要注意的是有很多項目（想成千上萬），所以我不打算爲每個項目編寫一個新的頁面;該頁面應該從項目數據自動生成（從主頁面傳遞，或從數據庫中獲取，並不重要）。ReactJS;導航到「動態」數據生成的新頁面？

如果項目是書籍，我希望它看起來像這樣; website.com/book/ReactJS For Dummies。現在書籍可以有不同的版本，這會影響頁面上顯示的數據，所以我需要傳遞一個額外的參數;像website.com/book/ReactJS For Dummies?edition=First_Edition。

我已經試着用Google搜索reactJS解決方案，但它們似乎都涉及到反應路由器和靜態鏈接到現有頁面，而不是像這樣的動態。

來源

2016-12-02 IronWaffleMan

顯然，我一直在尋找的是陣營，路由器的路徑道具，如下所示：

<Router history={browserHistory}> 
    <Route path="/" component={App}/> 
    <Route path="/book/:bookName/:bookEdition" component={Book}/> 
</Router>

然後，我可以在一個Link包裹的任何組分：

<Link to={"/book/ReactJS For Dummies/1st Edition"}><p>Link here</p></Link>

而在Book分量I可以通過this.props.params.bookName和this.props.params.bookEdition訪問這些道具。相當漂亮。

來源

2016-12-03 07:03:15 IronWaffleMan

我認爲最好是爲每本書分配一個唯一的密鑰，然後將密鑰作爲參數傳遞，這樣版本不是問題，它只是另一本書。有點像條碼。所以你必須

website.com/book/1作爲反應傻瓜第1版，然後

website.com/book/2作爲反應傻瓜第2版

傳遞一個ID作爲參數，會比用其他連接查詢書的名字要簡單得多

來源

2016-12-02 05:29:48

我確實認爲這是一個選項，但對於我的特定設計，最好讓URL包含純文本的書籍信息。 – IronWaffleMan

ReactJS;導航到「動態」數據生成的新頁面？

回答

相關問題