javascript - React router v4 内页(javascript)

Question

尝试这样做

<Route path="/oa/work" component={Work}>
<Route path="/oa/work/addwork" component={AddWork}/>
</Route>

我的链接<Link className="btn-blue-style" to="/oa/work/addwork">Add new Job</Link>

当点击我不移动到AddWork页面时，只停留在Work和链接更改

Answer 1

使用exact以确保匹配完整的位置路径。

<Route exact path="/oa/work" component={Work}>
<Route exact path="/oa/work/addwork" component={AddWork}/>

你的路由器应该是这样的:

   <Router>
        <div>
            <ul>
                <li>
                    <Link to="/oa/work">Work</Link>
                </li>
                <li>
                    <Link to="/oa/work/addwork">Add Work</Link>
                </li>
            </ul>
            <hr />
            <Route exact path="/oa/work" component={Work} />
            <Route exact path="/oa/work/addwork" component={AddWork} />    
        </div>
    </Router>