无法使用React Router 4的<redirect>

时间:2017-07-17 06:18:57

标签: reactjs react-router

Packages

"react": "^15.5.4",
"react-router": "^4.1.1",
"react-router-dom": "^4.1.1",
"webpack": "^2.4.1"

应该将用户重定向到新位置的功能:

successfullySignedUp()
{
        let userData = this.props.signUpResult.signUpData;
        this.saveLocalUserToBrowser(userData);
        console.log('login success', userData); // -> successful
        return (<Redirect to="/about"/>); == -> No response from command
}

我尝试过其他选项,

return (<Redirect to={{ pathname: '/login' }}/>);

return (<Redirect push to="/somewhere/else"/>);

<Switch>
  <Redirect from='/old-path' to='/new-path'/>
  <Route path='/new-path' component={Place}/>
</Switch>

我见过从Redirectreact-router导入react-router-dom的示例,这些示例在我的情况下都不起作用。

我在Layout类中定义了我的路线:

class Layout extends React.Component
{
    render()
    {

        return (

            <Provider store={store}>
                <BrowserRouter>
                    <Switch>
                        <Route path="/about/test" component={AboutPage} />
                        <Route path="/how-it-works" component={HowItWorksPage} />
                        <Route path="/all-restaurants" component={AllRestaurantsPage} />
                        <Route path="/restaurant" component={RestaurantPage} />
                        <Route path="/faq" component={FAQPage} />
                        <Route path="/login" component={LoginPage} />
                        <Route path="/register" component={SignupPage} />
                        <Route path="/" component={HomePage} />
                        <Route path="/home" component={HomePage} />
                    </Switch>
                </BrowserRouter>
            </Provider>

        )
    }
}

并在index.js中实现它:

ReactDOM.render
(
    <Layout />,
    document.getElementById('app')
);

0 个答案:

没有答案