React-router routing jump error using history.push

< H2 > react-router routing jump error using history.push < / H2 >
  • routing page http://localhost:8888/detail/5aae1cc8f5dfc27d7ad98909
  • Route form 
<Route path="/detail/:id" component = {TopicDetail} key = "detail" />
<Route path="/user/login" component = {UserLogin} key = "login" />
  • component TopicDetail partial code 
class TopicDetail extends React.Component{
    static contextTypes = {
        router:PropTypes.object,
    }
    constructor(props){
        super(props)
        this.goToLogin = this.goToLogin.bind(this)
    }
    /*--------------*/
    goToLogin() {
        this.context.router.history.push("user/login")
    }

    render() {
        return (
            <div>
                <section className={classes.notLoginButton}>
                    <Button raised color="inherit" onClick={this.goToLogin}>
                                     
                    </Button>
                </section>
            </div>
        )
    }
}
  • question: Click the button to call this.context.router.history.push ("user/login"). Why does the route jump from http://localhost:8888/detail/5aae1cc8f5dfc27d7ad98909 to http://localhost:8888/detail/user/login instead of http://localhost:8888/user/login?
React.js javascript
Mar.02,2021

it's best to give the code Demo, so that it doesn't solve

see if there's anything wrong with the path, and add a "/". / "give it a try. 

<Switch>
 <Router />
 <Router />
</Switch>

Previous: WSGI is in doubt with php-fpm.

Next: Permission to use cwrsync from Linux Synchronize file to windows file is lost

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
© 2021 CodesHelper
Advertising Contact us About us
Menu