2016-08-18 69 views
1

我試圖根據url中的查詢創建具有不同內容的反應頁面。例如:things?type = 0和things?type = 1導致不同的過濾內容。React頁面不會在URL查詢更改上重新提交

問題是,當切換到這些頁面時,React不會觸發頁面的重新渲染。我需要手動刷新頁面以獲得所需的結果。

我試圖使用生命週期功能中的構建,但它們中沒有一個觸發頁面刷新。它試圖做我的componentWillReceiveProps方法獲取與當時的我必須點擊兩次,讓我過濾的內容(這是比任何頁面刷新更好,但不是用戶友好的) https://facebook.github.io/react/docs/component-specs.html

回答

0

你可能會想使用https://github.com/reactjs/react-router或某些類似的路線圖書館。

如果你想自己去,你必須聽聽瀏覽器的歷史變化。你可以這樣做,例如:

componentDidMount: function() { 
    var component = this; 

    window.onpopstate = function() { 
    console.log(window.history.state); 
    component.setState({ 
     query: window.location.search 
    }); 
    }; 
}; 

我不確定這是否是最好的方法,但至少應該起作用。

+0

是的,我正在使用反應路由器。我試過你的解決方案,但仍然沒有頁面刷新。 – berndbousard