브라우저의 URL을 변경하지 않고 404 구성 요소로 리디렉션하시겠습니까?

질문:

유니버설 레드ux 프로그램을 만들고 있습니다. 사용자가 존재하지 않는 URL을 요청하면 404 경로로 다시 지정하지만 this problem 프로그램이 있습니다. 사용자가 '후퇴' 단추를 누르면 되돌아오지 않습니다.
URL을 변경하지 않은 상태에서 404 루트로 바꿀 방법이 있습니까?
나의 노선은 이렇다.
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>
);
리디렉션을 위해 이 redux 작업을 호출합니다.
import { push } from 'react-router-redux';

export default function redirect404() {
    return (dispatch) => {
        dispatch(push('/404'));
    };
}
내가 지금 가지고 있는 모든 것은 매우 효과적이지만, 나는 일부 사용자 체험의 좌절감을 볼 수 있다.
편집: 문제는 다음과 같은 매개변수가 있는 라우팅에서 비롯된 것이라고 생각합니다.<Route path="venues/:venueName" component={VenueContainer} /> .
React 라우터가 다음 위치로 리디렉션하지 않고 일치하는 항목을 보았습니다.<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());
        });
    };
}

답안

사용 시도replacepush
  • push - Pushes a new location to history, becoming the current location
  • replace - Replaces the current location in history.

react-router-redux
import { push } from 'react-router-redux';

export default function redirect404() {
  return (dispatch) => {
    dispatch(replace('/404'));
  };
}