react-router 4がクエリパラメータでURLを更新しない

Question

上位レベルのフィルタコンポーネントを使用して、クエリパラメータをURLに追加して、ユーザーがさまざまなタイプのフィルタとリンクを共有できるようにします。

私はコンポーネントwithRouter()をエクスポートしていますが、すべてが正当だと思われます。コンポーネントのプロップに履歴が挿入されています。私はこのコードの一部を呼び出すとき しかし：

this.props.history.push({ 
     pathname: this.props.history.location.pathname, 
     query: { tags: selectedTags } 
    }); 

それはthis.props.historyの状態を変更し、私は私のクエリは現在見ることができますが、ブラウザでURLは変更されません。私は何か間違っているのですか？

Answer 1

私は同じ状況に遭遇しました。私の解決策は、ブラウザのURLを変更することができるブラウザの履歴APIのpushState()メソッドを使用することです。ページの内容を変更するという点では、ReactのsetState()メソッドを使用します。あなたはそれが間違って使用している

Answer 2

、あなたのコードは次のようになります。

this.props.history.push({ 
     pathname: this.props.history.location.pathname, 
     search: `?tags=${ selectedTags }` 
    }); 

あなたはナビゲーション詳細を読むことができます：https://github.com/ReactTraining/history#navigation