2017-12-31 130 views
1

のためにリダイレクトされていない、私のルーターページでReactstrapまたはリアクト・ルータV4のは、私のヘッダー内の一部のアドレスリンクの変更

<NavItem> 
    <NavLink tag={Link} to="/template/editor">New Template</NavLink> 
</NavItem> 

私は私のホームページ上だ場合
<BrowserRouter> 
    <div className="container-fluid"> 
    <Header /> 
    <section className="page-content"> 
     <Route exact path="/" component={HomePage} /> 
     <Route exact path="/template/editor/:id?" component={Authenticate(EditorPage)} /> 
    </section> 
    </div> 
</BrowserRouter> 

(/)とNew Template Link(/ template/editor)をクリックすると、New Templateページにリダイレクトされます。しかし、私が(/ template/editor/3)をオンにして、新しいテンプレートリンク(/ template/editor)をクリックすると、アドレスバーは更新されますが、ページはルーティングされません。私は何かシンプルなものを欠いていると確信していますが、私は何が分かりません。

+0

react-reduxと 'connect'を多分使っていますか? – Tomasz

+0

@トーマスはい、なぜですか? – SILENT

+0

多分これに関連している:https://stackoverflow.com/questions/43895805/react-router-4-does-not-update-view-on-link-but-does-on-refresh – Tomasz

答えて

1

私は問題が何であるかはよく分からないが、私はあなたが何しようとしたことであると信じている:あなたはあなたが言った、また

(私はreact-router-domパッケージからSwitchを使用に注意してください)

<BrowserRouter> 
    <div className="container-fluid"> 
    <Header /> 
    <section className="page-content"> 
     <Switch> 
     <Route exact path="/" component={HomePage} /> 
     <Route path="/template/editor/:id?" component={Authenticate(EditorPage)} /> 
     </Switch> 
    </section> 
    </div> 
</BrowserRouter> 

react-reduxを使用すると、更新されないビューに関する既知の問題があります。 Look at this question

+0

それは私の問題のようです。私は固定スイッチ。しかし、私はパフォーマンスのために純粋な:falseを使用することに躊躇しています。私はこの問題がないようにアプリケーションを設計する必要がある "正しい方法"がありますか? withRouterオプションはより良い方法ですか? – SILENT

+0

@SILENTはい、これは少し「ハッキー」です。 'connect'は小道具を比較し、何も変更されていなければ(アプリケーションの場所が変更されても)再レンダリングしません。あなたは '{pure:false}'でいつも再レンダリングするために 'connect'に指示する必要があります。あるいは、場所の変更時に変化する反応ルータの小道具を渡すために' withRouter'を使用することもできます。 – Tomasz

+1

私は今、私の控除を介してナビゲーション要求を実行しています。これにより、私はハッキーな方法から逃れることができました。 – SILENT

関連する問題