反应路由器未重定向（仅在重新加载页面后）

Question

如果订单取消，我想将用户重定向到其他路线

import * as React from 'react';
import { Route, RouteProps, Redirect } from 'react-router-dom';
import { useSelector } from 'react-redux';
import { getOrderId, isCancelled } from '../Checkout/store/order/selectors';

const ProtectedRoute: React.FC<RouteProps> = props => {
    const orderId = useSelector(getOrderId);
    const isOrderCancelled = useSelector(isCancelled);
    console.log(isOrderCancelled); // <-- true

    return isOrderCancelled ? <Redirect to={`/booking/${orderId}/passengers`} /> : <Route {...props} />;
};

export default ProtectedRoute;

但是我没有重定向，而是获得了一个空页面，并且只有当我重新加载页面时它才能正常工作

看起来像这样：

并且仅当我重新加载页面时才能正常工作