リアクタルータのパス検証とリダイレクト

Question

SPAの実装にはreact-routerとreact-router-reduxを使用しています。 は、私はそのようなUIを実装する：

私はEntitnesのリストを持っていると私はEntityをクリックすると、urlはidがEntitiy」ですhttp://domain/entities/idにhttp://domain/entitiesから変更された主なアイデアs idと特定のReactコンポーネントが読み込まれます。

ナビゲーションを実行するにはpushメソッドをreact-router-reduxから使用していますが、urlというパスも入力できます。 しかし、私は何らかの形でurl paramsを検証する必要があります。 idを確認したいのですが、正しい形式であり、特定のエンティティが存在していない場合は、urlをロールバックしてエラーアラートを表示する必要があります。

私はそれができると思いますが、私はReactの非常に初心者ですから、あなたからのアドバイスを聞きたいと思います。

ありがとうございます。

Answer 1

反応ルータのフックの詳細onEnter, etc. あなたのルートでそれらを特定できます。 https://github.com/reactjs/react-router/blob/master/docs/API.md#route

例：

var correctDataHandler = function(transition) { 
if(condition) 
    transition.redirect('/') 
}; 

var router = ReactDOM.render((
    <ReactRouter.Router history={ReactRouter.createMemoryHistory()}> 
     <ReactRouter.Route path="/" component={ AddressForm } /> 
     <ReactRouter.Route path="/map-page" component={ Map } onEnter={ correctDataHandler } /> 
     <ReactRouter.Route path="/select-product-page" component={ CardsList } /> 
     <ReactRouter.Route path="/login" component={ LoginRegisterPage } /> 
    </ReactRouter.Router>