react-dom.production.min.js：171 RangeError：超出最大调用堆栈大小

Question

我已经搜索了整个网络以解决该递归问题，但找不到任何内容... 在大多数情况下，在didUpdate（）函数中调用setState（）时会发生此问题，但这不是我的情况。

最初我使用的是react v15，我的应用在这两个平台上都运行良好 环境，开发和生产。

最近我决定升级以响应v16，并且还升级到节点8.12.0。

此时，当NODE_ENV = development时，我的应用程序运行正常，但是当我部署到生产环境（NODE_ENV = production）时，我开始在chrome浏览器的控制台中遇到这个奇怪的问题

我发现，如果我降级到版本15，我的应用程序将再次在生产环境中工作。

在调查期间，我已经测试过，调度太多的动作会触发“超出最大调用堆栈大小”问题。

为什么我的代码在NODE_DEVELOPMENT时工作正常，而在NODE_ENV-生产时崩溃？

有人可以给我一些帮助吗？

请找到我的代码：ContainerPage.js

class ContainerPage extends Component {
    constructor(props) {
        super(props);
        const { locale } = props;
        moment.locale(locale);
    }

    componentDidMount() {
        const {
            getGeometry,
            getCountries,
            getNodes,
            geometry = [],
            location: { query = {} } = {},
        } = this.props;
        const { INIT_CORPORATION_TREE } = actions;
        if (geometry.length === 0) {
            getCountries();
            getGeometry();
        }
        getNodes(
            {
                action: INIT_CORPORATION_TREE,
                corporationIdQuery: !isEmpty(query) ? query.corporationId : null,
            });
    }

    render() {
        const { content,
            children,
            header,
            commonProfileSetup,
            selectedCorporation = {},
            riskConfig: { riskConfigInitialized = false } = {},
        } = this.props;
        if (!isEmpty(selectedCorporation.id) && riskConfigInitialized) {
            return (
                <Col md={12}>

                    {content || children}
                </Col>
            );
        }
        return <div>test</div>;
    }
}

export default withRouter(ContainerPage);

Routes.js

export default (
  <Route component={App} onChange={scrollToTop}>
    <Route path="/nui">
      <Redirect
        from={config.nui.baseUrl}
        to={config.nui.baseUrl + '/search'}
      />
      <Route
        key="locate"
        path="locate"
        component={NuiPageContainer}
      >
        <Route getResponseHeaders={() => ({ 'X-Frame-Options': 'DENY' })}
          component={UserIsAuthorized(ContainerPage)}>
          <Route
            path="search"
            getComponents={(loc, cb) => {
              require.ensure([], require => {
                cb(null, {
                  header: () => <Header titleId="title._dynamic.search" />,
                  //commonProfileSetup: () => <CommonProfileSetup pageReducer="search" treeReducer="corporationTree"  showTree />,
                  //content: ({}) => <SearchPage pageReducer={PAGE_REDUCER.SEARCH} />,
                });
              });
            }}
          />
        </Route>
      </Route>
    </Route>
  </Route>

发送动作

export const getCountries = withJWT(
  createFetchAction(
    GET_COUNTRIES,
    `${RM_BASE_URI}/country/countries`,
    getOptions
  )
);


// Getting geometry from local file
export const getGeometry = () => {
  return {
    type: GET_GEOMETRY,
    payload: GEOMETRY,
  };
};


export function getNodes(param = {  }, actions) {
  return (dispatch, getState, parentState) => {
    const { selectedNode } = getState()[parentState];
    const {
      JWT: { token },
      routing: { locationBeforeTransitions: { pathname = '' } = {} } = {},
      userPrefs: { loginName }
    } = getState();
    const {
      FETCHING_NODES,
      RESET_TREE,
      HIGHLIGHT_SELECTED_CORPORATION,
      SET_CORPORATION_PROGRAMMATICALLY,
      SET_CORPORATION_FROM_DB,
      INIT_CORPORATION_TREE,
    } = actions;
    let url;
    url = `${config.nui.riskMessaging.uri}/corporation/default?concurLoginId=${loginName}`;
    if (!isEmpty(param.corporationIdQuery)) {
      url = `${url}&selectedCorporation=${param.corporationIdQuery}`;
      if (pathname.includes('details')) {
        url = `${url}&subLevelsOnly=true`;
      }
    }
    const { action = '' } = param;
    const onCompleteAction = action;
    const loadingAction = FETCHING_NODES;
    return fetch(url, {
      method: 'GET',
      mode: 'cors',
      headers: {
        Authorization: `Bearer ${token}`,
        'Content-Type': 'application/json',
        'Accept': 'application/json',
        'Access-Control-Allow-Origin': '*'
      }
    })
      .then(response => {
        if (response.status === 200) {
          return response.json();
        }
      })
      .then(result => {
        const { corporationTree: { corporations } } = getState();
        dispatch(createAction('INIT_CORPORATION_TREE')(result));

      })
      .catch(function (err) {
        console.log("Oops... " + err);
      });

  };