react-router4, “/”的子路由“/test”渲染不出来,未匹配路由,帮忙看下

贴相关代码:

i.app.jsx

render(){
    return (
     <HashRouter history={hashHistory}>
                <Switch>
                <Route path="/" exact component={Home}></Route>
                <Route path="/info" exact component={Info}></Route>
                </Switch>
    </HashRouter>
    )
}

2.home.jsx

import Test from "@/test.jsx";

handleClick = () => {
    this.props.history.push(`/test`);
};
render(){
    return (
        <button onClick={this.handleClick.bind(this)}>测试嵌套路由</button >
        <Route path=`/test` component={Test} />
    )
}

3.test.jsx

render(){
    return (
        <div>子路由测试页</div>
    )
}

export default withRouter(Test);

问题描述: 打开http://localhost:3000/#/ 的时候,没有问题,当我点击按钮测试子路由的时候,路由为http://localhost:3000/#/test 但是并没有渲染,没有匹配到,请问是怎么回事,网上的方法都试了,withRouter history之类,并不能解决。
但是info嵌套路由相关就可以,‘/’是不能有子路由吗?

阅读 2.7k
2 个回答
<Route path="/test" exact component={Test}></Route>

emmm 好像是这样的

你要把他放在总路由下

<HashRouter history={hashHistory}>
                <Switch>
                <Route path="/" exact component={Home}></Route>
                <Route path="/info" exact component={Info}></Route>
                <Route path="/test" exact component={Test}></Route>
                </Switch>
 </HashRouter>

你好,我也遇到了你的这个问题,请问你解决了么

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题