“(AppContainer)的RangeError(最大调用堆栈大小超过” - 阵营与反应热装载机)

登山则情满于山,观海则意溢于海。这篇文章主要讲述“(AppContainer)的RangeError:最大调用堆栈大小超过” - 阵营与反应热装载机相关的知识,希望能为你提供帮助。
我与真正奇怪的错误挣扎,我没有找到最后2小时的解决方案,所以我决定寻求帮助。
我的反应,终极版,安装的WebPack,阵营热装载机,所有的打字稿。
我已经使用了一个样板,但之后,我就遇到了这个问题,我改变的WebPack配置,以反映例如,从RHL回购。
它是正确编译,但我不能得到保护的途径工作,因为如果用户通过验证,那么它应该呈现提供组件,它是从这个问题的标题抛出错误。
这是我的ProtectedRoute组件:

import React, { Component, FunctionComponent } from 'react'; import { Redirect, Route } from 'react-router'; import { isAuthenticated } from './auth'; interface IProps { component: Component | FunctionComponent; path: string; } const ProtectedRoute: FunctionComponent< IProps> = ({ component, ...rest }) => ( < Route {...rest} render={(props) => { if (isAuthenticated()) { console.log('should render', component); return < Component /> ; } return < Redirect to="/login" /> ; }} /> ); export default ProtectedRoute;

简单的这样。
我试图只需使用:
< ProtectedRoute path="/dashboard" component={() => < div> Test< /div> } />

isAuthenticated是一个疯狂的简单功能至今:
export const isAuthenticated = () => { const accessToken = localStorage.getItem(ACCESS_TOKEN_STORAGE_KEY); console.log('checking auth'); if (accessToken) { return true; } return false; };

我可以通过什么的保护路由,它总是会抛出:
(AppContainer)的RangeError:最大调用堆栈大小超过
这是调用堆栈:
反应热-loader.development.js 2cd8:2202未捕获的RangeError:在renderReconciler超过最大调用堆栈大小(反应热-loader.development.js 2cd8:2202)在Object.asyncReconciledRender [按componentWillRender](反应热-loader.development.js 2cd8:2220)在Component.hotComponentRender(反应热-loader.development.js 2cd8:?718)在Component.proxiedRender(反应热-loader.development.js 2cd8:750)在在Component.proxiedRender(反应热-loader.development.js 2cd8?:750):Component.hotComponentRender(730反应热-loader.development.js 2cd8?)在Component.hotComponentRender(反应热-loader.development。 JS 2cd8:730)在Component.proxiedRender(反应热-loader.development.js 2cd8:750)在Component.hotComponentRender(反应热-loader.development.js 2cd8:730)在Component.proxiedRender(反应 - 供热loader.development.js 2cd8:750)
我真的有不知道是怎么回事。
【“(AppContainer)的RangeError(最大调用堆栈大小超过” - 阵营与反应热装载机)】我试图更改配置:
setConfig({ logLevel: 'debug', ignoreSFC: true, // the same error pureRender: true // change error to instance.render is not a function });

但它并不能帮助。
我会很感激的任何帮助。
与复制问题的回购:https://github.com/murbanowicz/rhl-issue
答案ProtectedRoute的渲染方法返回,而不是传递给它的道具组件React.Component。

    推荐阅读