reactjs - 无法读取未定义的属性'toJS'

我有两个数组。但是，当其中之一为null时，会出现以下错误:

无法读取该行中 undefined 的属性“toJS”

这是触发错误的相关调用:{groupsGuney.toJS()}
这是我对变量let groupsGuney, groupsKuzey;的声明

最后是我的两个数组。但是，当其中之一为null时，会出现错误:

...
    if (muso == 1) {
      groupsGuney = this.props.groups
        .groupBy((group, idx) => idx % maxRows)
          .map((ggs, idx) => {
            return this.renderGroups(ggs, idx);
          }).toList().flatten(true);
    }

    if (muso == 2) {
      groupsKuzey = this.props.groups
        .groupBy((group, idx) => idx % maxRows)
          .map((ggs, idx) => {
            return this.renderGroups(ggs, idx);
          }).toList().flatten(true);
    }

    var result = (
      <div>
        <div className={classSelector + ' discard-mini-box-area'} >
           { groupsGuney.toJS() }
        </div>
        <div className={classSelector + ' discard-mini-box-area'} >
           { groupsKuzey.toJS() }
        </div>
      </div>
    );

    return result;
  }
}

export default DiscardMiniBoxArea;

最佳答案

而不是做:

<div>
   <div className={classSelector + ' discard-mini-box-area'} >
     {groupsGuney.toJS()}
   </div>
   ....

你应该做:

<div>
   <div className={classSelector + ' discard-mini-box-area'} >
     {groupsGuney && groupsGuney.toJS()}
   </div>
   ....

在对象上调用函数之前，需要确保该函数已经存在。如果不确定您的对象始终具有该功能，则需要进行额外的检查，以确保toJS存在并且该功能有效。

如果是这种情况，请将容器中的内容更新为:

{groupsGuney && typeof groupsGuney.toJS === 'function' && groupsGuney.toJS()}

但是，理想情况下，如果您要渲染的内容不存在，则根本不会渲染该特定组。在呈现组件之前，应将这些检查移到。