Question

我有一个React应用，其基本结构如下所示。我正在尝试以编程方式将用户重定向到/profile路由，但看到Warning: You tried to redirect to the same route you're currently on: "/profile"。

在Main组件header的内部，我有一个应将用户重定向到/profile的表单。我能够完成此工作的唯一方法是将&& this.props.location.pathname !== '/profile'添加到state.toProfile条件中。感觉有点脏。似乎有更好的方法。

我正在采用此博客文章https://tylermcginnis.com/react-router-programmatically-navigate/中推荐的方法，如果您重定向到的路由包含与从其重定向的路由相同的组件，这似乎不起作用。

class App extends Component {
    render() {
        return (
            <BrowserRouter>
                <Switch>
                    <Route path="/dashboard" component={Dashboard} />
                    <Route component={Main} />
                </Switch>
            </BrowserRouter>
        );
    }
}

class Main extends Component {

    state = {
        toProfile: false
    }

    render() {
        if (this.state.toProfile === true) {
            return <Redirect to='/profile' />
        }

        return (
            <header>
                ...
            </header>
        );
    }
}

Answer 1

您需要为/profile添加一条路由，自动取款机配置文件转到Main，然后又转到/ profile ...

React Router v4程序化重定向：重定向到“相同路由”时警告

1 个答案: