【React】不再支持将对象作为React子组件。请处理该错误的方法

环境

• React version18

CodeSandBbox

错误内容

在尝试React官方教程时，出现了以下错误。

错误
对象无法作为 React 的子级（找到的是具有键 {value，onSquareClick} 的对象）。如果您打算呈现一个子级集合，请使用数组代替。

机器翻译的结果如下所示。

请使用数组来渲染子组件集合，因为该对象（包含键值 {value, onSquareClick}）不能作为 React 的子组件有效。

假设

首先，我查找了被错误指出的{value, onSquareClick}所写的位置。
然后，我发现虽然没有{}，但是将value和onSquareClick作为子组件的props传递了。

<Square value={squares[0]} onSquareClick={handleClick} />

export default function Square(value, onSquareClick) {
  return (
    <button className="square" onClick={onSquareClick}>
      {value}
    </button>
  );
}

从错误信息 “React 的子组件无效” 中推测出传递给子组件的 props 的方式可能有误。

进行解决

試試看加上{}作為{value, onSquareClick}，結果發現錯誤已解決。

export default function Square({value, onSquareClick}) {
  return (
    <button className="square" onClick={onSquareClick}>
      {value}
    </button>
  );
}

我突然想起来了，当传递多个props时，必须将其作为对象传递，或者一定要用{}括起来并进行解构赋值。

可能是由于没有用大括号包围value，而将其作为onSquareClick参数，导致出现错误。或者有人指出，如果想传递多个参数，可以尝试使用数组将它们合并为一个参数。

最后

由于我才开始学习React不到3天，所以我对错误信息进行了相当推测和解释。
如果有错误，请务必告诉我！非常感谢。

请提供参考资料。
请提供相关参考资料。
请提供可以参考的资料。
请提供可以参考的文献。

• 公式：コンポーネントに props を渡す

モダンJavaScriptの基礎から始める挫折しないためのReact入門