javascript - 大きなオブジェクトで setState を実行すると、コンポーネントが DOM から削除されます

Question

ドラッグ アンド ドロップで絵文字を整理できるアプリを作成しています。絵文字オブジェクトの大規模な配列をソートするドロップ時に実行されるメソッドがあります。setState を実行してオブジェクトをコミットして親コンポーネントの状態に戻すと、React は親コンポーネントを DOM から削除します。消えるだけです...コンソールにエラーはなく、react devツールを使用すると、コンポーネントの状態が実際に新しいオブジェクトで更新されていることがわかります。どんな助けでも大歓迎です。

この並べ替えメカニズムは、更新されたオブジェクトを props を介してその親コン​​ポーネントに送信します。

  endDrag(props, monitor, dragComponent) {
    if (monitor.didDrop()) {

      let sourceEmoji = dragComponent.props.emoji
      let targetEmoji = monitor.getDropResult().props.emoji

      const updatedCategorizedEmojis = props.categorizedEmojis.map((category)=> {
        return category.emojis.map((emoji, idx)=> {
          if (emoji.id == sourceEmoji.id) {
            emoji['newPosition'] = (targetEmoji['newPosition'] - 0.5)
            return emoji
          } else {
            return emoji
          }
        }).sort((a,b)=> {
          if (a['newPosition'] > b['newPosition']) {
            return 1
          }
          if (a['newPosition'] < b['newPosition']) {
            return -1
          }
        }).map((emoji, idx)=> {
          emoji['newPosition'] = idx
          return emoji
        })
      })

      props.updateSortedEmojis(updatedCategorizedEmojis)

    }
  }

オブジェクトの配列は次のようになります。

そのすべてが親の状態に追加され、コンポーネントがエラーなしで削除されます。

どんな情報でも大歓迎です、ありがとう！