登山则情满于山,观海则意溢于海。这篇文章主要讲述“(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。
推荐阅读
- 如何在global.asax中注册Automapper配置类()
- Android Studio中不同的构建类型使用不同的lint.xml吗()
- 错误(在项目':app'上找不到参数[目录'libs']的方法implimentation())
- 如何在PHP中使用Imagick向图像添加水印
- 如何防止本机上下文菜单出现在WinForms中的CefSharp控件上
- 如何在WinForms应用程序中使用带有C#的Material Design控件
- 如何在C# WinForms应用程序中安装,配置和使用MetroFramework(样式化接口组件)
- 如何在WinForms中使用C#列出所有Windows进程及其属性(类似任务管理器)
- 如何在C#中的WinForms应用程序中实现Jint(JavaScript解释器)