首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >React路由器与基本路径不匹配

React路由器与基本路径不匹配
EN

Stack Overflow用户
提问于 2018-06-07 06:36:13
回答 1查看 532关注 0票数 0

我正在练习与反应路由器,并需要有一个:id参数。它与url中的an匹配,例如/edit/2,但不与仅有/edit的基本大小写匹配。

主应用程序路由器文件

代码语言:javascript
复制
import React from 'react';
import {BrowserRouter, Route, Switch, Link, NavLink} from 'react-router-dom';
import landingPage from '../components/landingPage';
import editPage from '../components/editPage';
import createPage from '../components/createPage';
import helpPage from '../components/helpPage';
import notFoundPage from '../components/notFoundPage';
import Header from '../components/header';


const AppRouter = () => (
    <BrowserRouter>
        <div>
            <Header/>
            <Switch>
                <Route exact={true} path="/" component={landingPage}/>
                <Route path="/create" component={createPage}/>
                <Route exact={false} path="/edit/:id" component={editPage}/>
                <Route path="/help" component={helpPage}/>
                <Route component={notFoundPage}/>
            </Switch>
        </div>
    </BrowserRouter>
);

export default AppRouter;

editPage代码

代码语言:javascript
复制
import React from 'react';

const editPage = (props) => {
    console.log(props)
    return (
    <div>Edit Page</div>
    );
}
export default editPage;
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2018-06-07 06:43:12

如果您使用的是React Router >= v4,则可以通过在参数名称后添加一个?来执行make a parameter optional

代码语言:javascript
复制
<Route exact={false} path="/edit/:id?" component={editPage}/>
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/50730572

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档