私は普遍的なreduxアプリケーションを作っています。どこにも存在しないURLを要求すると404ルートにリダイレクトされますが、私はthis problemを持っています。戻るボタンをクリックすると、戻ることはできません。ブラウザのURLを変更せずに404コンポーネントにリダイレクトしますか?
URLを変更せずに404経路にリダイレクトする方法はありますか?リダイレクトするために、このReduxのアクションを呼び出す
export default (
<Route path="/" component={App}>
<IndexRoute component={MainPage} />
<Route path="venues/:venueName" component={VenueContainer} />
<Route path="404" component={NotFound} />
<Route path="*" component={NotFound} />
</Route>
);
:ここ
は私のルートがどのように見えるかだ
import { push } from 'react-router-redux';
export default function redirect404() {
return (dispatch) => {
dispatch(push('/404'));
};
}
私が今持っていることは動作しますが、私はいくつかのユーザー・エクスペリエンスのフラストレーションがから出てきて見ることができますそれ。
EDIT:この問題は、パラメータがあるルートから発生していると思われます。 <Route path="venues/:venueName" component={VenueContainer} />
などです。 リアクタが一致したと見なし、 <Route path="*" component={NotFound} />
にリダイレクトしません。
私は、外部APIからデータを要求することだし、存在しない場合は、私は、URLを変更せずに404を表示したい:
import axios from 'axios';
import redirect404 from './utilActions';
export function fetchVenue() {
return (dispatch) => {
dispatch({
type: 'FETCH_VENUE',
payload: axios.get('http://externalAPI.com'),
})
.catch((error) => {
console.info(error);
dispatch(redirect404());
});
};
}
? '*'はURLを変更せずに 'NotFound'コンポーネントを呼び出す必要があります – Robiseb
これはこのようなパラメータを持つルートでは動作しません ' ' –