質問編集履歴
2
追記
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -189,3 +189,63 @@
|
|
|
189
189
|
ちなみに下記リンク先を参考にルーティングしました。
|
|
190
190
|
|
|
191
191
|
[React-Router v4を使って認証状態でリダイレクトする処理](https://qiita.com/soutaito/items/691ac9dabe765e98d9f9)
|
|
192
|
+
|
|
193
|
+
|
|
194
|
+
|
|
195
|
+
### 追記
|
|
196
|
+
|
|
197
|
+
よく考えたら、下記のようにして`loading`というstateを持たせて`true`の時は` return <p>Now loading...</p>;`みたいな感じで実装したらいいのですかね...
|
|
198
|
+
|
|
199
|
+
下記のようにしたら一応思った挙動にはなっているようなのですが、これがベストプラクティスかどうかはわからないので、まだ回答は募集します<(_ _)>
|
|
200
|
+
|
|
201
|
+
|
|
202
|
+
|
|
203
|
+
```jsx:Auth.jsx
|
|
204
|
+
|
|
205
|
+
// 略
|
|
206
|
+
|
|
207
|
+
constructor(props) {
|
|
208
|
+
|
|
209
|
+
super(props);
|
|
210
|
+
|
|
211
|
+
this.state = {
|
|
212
|
+
|
|
213
|
+
auth: false,
|
|
214
|
+
|
|
215
|
+
loading: true,
|
|
216
|
+
|
|
217
|
+
};
|
|
218
|
+
|
|
219
|
+
}
|
|
220
|
+
|
|
221
|
+
|
|
222
|
+
|
|
223
|
+
// 略
|
|
224
|
+
|
|
225
|
+
render() {
|
|
226
|
+
|
|
227
|
+
if (this.state.loading) {
|
|
228
|
+
|
|
229
|
+
return <p>Now loading...</p>;
|
|
230
|
+
|
|
231
|
+
}
|
|
232
|
+
|
|
233
|
+
if (!this.state.auth) {
|
|
234
|
+
|
|
235
|
+
return (
|
|
236
|
+
|
|
237
|
+
<Redirect to="/login" />
|
|
238
|
+
|
|
239
|
+
);
|
|
240
|
+
|
|
241
|
+
}
|
|
242
|
+
|
|
243
|
+
return (
|
|
244
|
+
|
|
245
|
+
this.props.children
|
|
246
|
+
|
|
247
|
+
);
|
|
248
|
+
|
|
249
|
+
}
|
|
250
|
+
|
|
251
|
+
```
|
1
説明の追加
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -156,7 +156,7 @@
|
|
|
156
156
|
|
|
157
157
|
|
|
158
158
|
|
|
159
|
-
未ログインの場合は`/login`にリダイレクトされるのですが、ログインされている状態で`localhost:8080/`とURLをブラウザに直打ちしてページを表示しようとすると、下記のような警告が表示されます。
|
|
159
|
+
未ログインの場合は`/login`にリダイレクトされるのですが、ログインされている状態で`localhost:8080/`とURLをブラウザに直打ちしてページを表示しようとすると、下記のような警告が表示され、`/login`にリダイレクトされます。
|
|
160
160
|
|
|
161
161
|
|
|
162
162
|
|