测试对孩子进行操作的效用函数答案

【问题标题】：test utility function which operatos over chidlren测试对孩子进行操作的效用函数
【发布时间】：2020-11-22 22:45:27
【问题描述】：

我有一个需要子组件的组件（称为layout component）。这个组件内部还有一个函数可以遍历子元素并做一些事情。我想测试这个功能。所以我提取了这个函数来分离实用程序类并给孩子们作为参数。它在浏览器中运行良好。

但在测试中我有问题。我不知道如何定义孩子并将其传递给这个实用函数。

  const children = (
      <div />
      <div />
  );

给我编译错误：“JSX 表达式必须有一个父 element.ts(2657)”。

将divs 与React.Fragment 包围

  const children = (
    <>
      <div />
      <div />
    </>
  );

在我的布局组件中只给了我 1 个孩子。

我想将孩子传递给实用函数，但我不知道如何定义它们。

【问题讨论】：

【解决方案1】：

而不是：

const children = (
  <div />
  <div />
);

你可以使用一个真实的数组，例如：

const children = ([
  <div key="0"/>,
  <div key="1"/>
]);

或者只是使用你已经弄清楚的片段。

【讨论】：