小编mat*_*jng的帖子

React 路由器在 URL 栏中不起作用,但它仍然可以与 <Link> 标签一起使用

所以我有一条像文档中那样的路线:<Route path="*"><Redirect to={'/'}/></Route>。确保如果路由不存在,所有路由都会指向“/”。

我的所有路由都可以使用<Link>标签,但当我在 URL 栏中输入它们时则不行。

怎么会这样?我在网上找不到这方面的信息。

索引文件:

    return(
  <Fragment>
    <BrowserRouter basename={`/`}>
    <Switch>
        <App>
            <TransitionGroup>
                {routes.map(({ path, Component }) => (
                    <Route key={path} exact path={`${process.env.PUBLIC_URL}${path}`}>
                        {({ match }) => (
                            <CSSTransition in={match != null} timeout={100} classNames={anim} unmountOnExit>
                                <div><Component/></div>
                            </CSSTransition>
                        )}
                    </Route>
                ))}

                <Route exact path="*"><Redirect to={'/'}/></Route>

            </TransitionGroup>
        </App>
    </Switch>
    </BrowserRouter>
  </Fragment>
  )
Run Code Online (Sandbox Code Playgroud)

路线文件:

export const routes = [
    {
            path:`/`,
            Component:Home
    },
    {
            path:`/login`,
            Component:Login
    },
    {
            path:`/signup`,
            Component:Signup
    },
    {
            path:`/event/:name`,
            Component:Event
    },
    {
            path:`/create-event`, …
Run Code Online (Sandbox Code Playgroud)

reactjs react-router

5
推荐指数
1
解决办法
1301
查看次数

标签 统计

react-router ×1

reactjs ×1