reactjs - 为什么无法在反应中加载详细信息页面

Question

现在我定义这样的路由路径：

const ArticleDetail = loadable(() =>
    import(/* webpackChunkName: 'about' */ '@/views/App/Cruise/Article/ArticleDetail/ArticleDetail')
)

    {
            path: '/app/cruise/article/detail/:id',
            exact: false,
            name: 'Article Detail',
            component: ArticleDetail
        },

但是当我使用 url: 访问 articleDetail 时http://localhost:3000/#/app/cruise/article/detail/2923730，我跟踪代码并发现跑步者没有进入artcleDetail页面，我错过了什么吗？这是我的依赖项的一部分：

        "react": "^17.0.2",
        "react-dom": "^17.0.2",
        "react-highlight-words": "0.17.0",
        "react-loadable": "^5.5.0",
        "react-redux": "^7.1.1",
        "react-router-dom": "^5.1.1",

这是菜单渲染逻辑代码：

return (
            <Layout className='app'>
                <BackTop />
                <AppAside menuToggle={menuToggle} menu={this.state.menu} />
                <Layout style={{ marginLeft: menuToggle ? '80px' : '200px', minHeight: '100vh' }}>
                    <AppHeader
                        menuToggle={menuToggle}
                        menuClick={menuClick}
                        avatar={this.state.avatar}
                        show={this.state.show}
                        loginOut={this.loginOut}
                    />
                    <Content className='content'>
                        <Switch>
                            {routes.map(item => {
                                return (
                                    <Route
                                        key={item.path}
                                        path={item.path}
                                        exact={item.exact}
                                        render={props =>
                                            !auth ? (
                                                <item.component {...this.props} />
                                            ) : item.auth && item.auth.indexOf(auth) !== -1 ? (
                                                <item.component {...this.props} />
                                            ) : (

` <Redirect to='/404' {...props} /> }> ) })} )

我应该怎么做才能解决这个问题？打开时http://localhost:3000/#/app/cruise/article/detail/2923730，加载文章详细信息页面。

标签： reactjs