Question

在路由中添加了对授权用户的支票后，我开始收到无限的重新呈现错误。

App.js：

function App(props) {

    useEffect(() => props.checkUserToken() , []); // action проверяющий, есть ли JWT в localStorage, если да, то меняет props.isLogin на true
  
    return (
        <div className="d-flex align-items-center justify-content-center">
            <Switch>
                <Route path='/authorization'
                       render={props => !props.isLogin ? <Login {...props} /> : <Redirect to='/main' />}
                />

                <Route path='/main'
                       render={props => props.isLogin ? <MainPage {...props} /> : <Redirect to='/authorization' />}
                />
                <Route
                    render={props => <Redirect to={props.isLogin ? '/main' : '/authorization'} />}
                />
            </Switch>
            {
                props.loading && <Loading />
            }
        </div>
    )
}

这是redux-logger的输出：

Here's what the redux-logger outputs

首先，调用操作“ CHECK_TOKEN”（不注意保留），由Saga监听，并且根据检查结果，调用操作“ TOKEN_EXIST”，将isLogin更改为true从理论上讲，然后该应用应该重新呈现，再次“转到”授权路径并重定向到主路径，但出现错误提示。

起初我以为是关于检查令牌的，所以我在挂钩上进行了评论，然后重新登录，但是重复了一切，授权成功，接收了数据，isLogin变为true，但是再次出现此错误。

如果将调试器和console.log放在MainPage中，它们在运行中和sagas中都无法工作，我也可以肯定，因为它们都运行良好（并且仍然可以正常工作），直到我更改了路由（进行了检查）< / p>

正如我在上面所写，此错误仅在isLogin更改为true且应该发生重定向时才会弹出。

完整错误代码：

Full error code

那是什么问题，如何解决此错误？预先感谢您的帮助！

Answer 1

找到了！一如既往，错误在于小事情

<Route path= '/authorization'
render={props => !props.isLogin ? <MainPage {...props} /> : <Redirect to='/main' />}
/>

在类似的条目中，呈现器中的LE（词法环境）函数的props.isLogin等于undefined，因此不断触发错误条件，并且存在从/ main到/授权。解决方法是将props参数的名称更改为任何其他名称）

示例：

<Route path='/authorization'
render={lalala => !props.isLogin ? <MainPage {...lalala} /> : <Redirect to='/authorization' />}
/>

为什么会出现“超出最大更新深度”错误？

1 个答案: