react函数组件中tree树形控件将返回来的数据作为children和自己写的数据作为parent组在一起

可以使用递归的方式，在函数组件中遍历树形数据，并将返回来的数据作为子节点传递给当前节点的children属性。同时，在每个节点上添加一个parent属性，用于记录当前节点的父节点信息。

示例代码如下：

function TreeNode({ data, parent }) {
  return (
    <div>
      <h3>{data.title}</h3>
      {data.children && (
        <div>
          {data.children.map(child => (
            <TreeNode key={child.id} data={child} parent={data} />
          ))}
        </div>
      )}
    </div>
  );
}

function Tree({ data }) {
  return (
    <div>
      {data.map(node => (
        <TreeNode key={node.id} data={node} parent={null} />
      ))}
    </div>
  );
}

在上面的代码中，每个节点都会递归地遍历其子节点，并将子节点作为自己的children属性传递下去。同时，每个节点都会记录自己的父节点信息，即parent属性。

在使用时，只需要将树形数据作为props传递给Tree组件即可：

const data = [
  {
    id: 1,
    title: 'Node 1',
    children: [
      {
        id: 2,
        title: 'Node 1.1',
        children: [
          {
            id: 3,
            title: 'Node 1.1.1',
            children: []
          }
        ]
      },
      {
        id: 4,
        title: 'Node 1.2',
        children: []
      }
    ]
  }
];

function App() {
  return <Tree data={data} />;
}

在上面的代码中，data是一个树形结构的数据，包含了多个节点和它们的子节点信息。传递给Tree组件后，会渲染出整个树形结构。