[解決済み] react-router 2.0.0-rc5で現在のルートを取得する方法
2023-05-16 04:21:22
質問
以下のようなルーターがあります。
<Router history={hashHistory}>
<Route path="/" component={App}>
<IndexRoute component={Index}/>
<Route path="login" component={Login}/>
</Route>
</Router>
以下は、私が実現したいことです。
-
ユーザーを
/login
にリダイレクトします。 -
ユーザーがアクセスしようとした場合
/login
にアクセスしようとした場合、root にリダイレクトします。/
でユーザーの状態をチェックしようとしています。
App
's
componentDidMount
のようにすればいい。
if (!user.isLoggedIn) {
this.context.router.push('login')
} else if(currentRoute == 'login') {
this.context.router.push('/')
}
ここで問題なのは、現在のルートを取得するためのAPIが見つからないことです。
私が見つけたのは このクローズされた問題 では Router.ActiveState mixin とルートハンドラの使用が提案されていましたが、この 2 つの解決策は現在では非推奨となっているようです。
どのように解決するのですか?
さらにいくつかの文書を読んだ後、私は解決策を見つけました。
https://github.com/ReactTraining/react-router/blob/master/packages/react-router/docs/api/location.md
注入されたプロパティにアクセスする必要があるだけです
location
のようなコンポーネントのインスタンスにアクセスする必要があります。
var currentLocation = this.props.location.pathname
関連
-
[解決済み] JavaScriptでタイムスタンプを取得する方法は?
-
[解決済み] JavaScriptで現在のURLを取得する?
-
[解決済み] JavaScriptで現在の日付を取得するには?
-
[解決済み] JavaScriptでクエリ文字列の値を取得するにはどうすればよいですか?
-
[解決済み] セレクタの子を取得する方法は?
-
[解決済み] 画面サイズ、現在のウェブページ、ブラウザウィンドウのサイズを取得する
-
[解決済み] jQueryで現在のURLを取得する?
-
[解決済み] Reactルータを使ったプログラムによるナビゲーション
-
[解決済み] React-routerのURLを更新したり、手動で書き込んだりするとうまくいかない
-
[解決済み] React Router v4 - 現在のルートを取得する方法は?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] React Router v4 - 現在のルートを取得する方法は?
-
[解決済み] JSのDateからDay名
-
[解決済み] JavaScriptで、ある文字列が別の文字列の中に出現するすべてのインデックスを見つけるにはどうすればよいですか?
-
[解決済み] WebStormで未解決の変数が大量にある場合の警告に対処する方法は?
-
[解決済み] アサインの左側にJavascriptのオブジェクトブラケット表記({ ナビゲーション } =)があります。
-
[解決済み] moment.jsでミュータビリティを回避するには?
-
[解決済み] TypeScriptプロジェクトで既存のC#クラス定義を再利用する方法
-
[解決済み] Reactメモを使うべきではない場合とは?
-
[解決済み] Prototypeを使ってtextareaを自動サイズ調整するには?
-
[解決済み] Fetch: ステータスがOKでない場合、プロミスを拒否し、エラーをキャッチするか?