如何处理来自React组件的数据？

Question

import React from "react";

class A extends React.Component {
  handleMap = (letter, index) => <div key={index}>{letter}</div>;

  render() {
    const data = ["t", "e", "s", "t"];
    return data.map(this.handleMap);
  }
}

export default A;

我有一个称为A的组件，它在其中返回一个节点数组。

class B extends React.Component {
  render() {
    const test = <A />;
    // I want to manupulate the data coming into here. Particaullry 
    // I want to split the array into two seprate arrays. How can I do this?

    return (
      <div>
        {/* I can either put {test} here or <A/> and it will render*/}
        {test}
      </div>
    );
  }
}

如何操作“数据”以将数组分为两个数组？

我想在我的渲染方法中实现类似的目的

const data1 = [<div>t</div>, <div>e</div>]
const data2 = [<div>s</div>, <div>t</div>]