道具类型失败：提供给“ ForwardRef（Grid）”的道具“ children”无效

Question

这只是问题的一个示例，我能够使用许多元素来创建问题。替换元素的子组件时，什么是正确的方法，以免将无效的道具children提供给`ForwardRef？

const dynamicJSX = () => {
  return (
    <div>Working</div>
  )
}

return (
  <Grid container >
    <Grid item >
      {dynamicJSX}
    </Grid>
  </Grid>
)

Answer 1

您应该使用<dynamicJSX />而不是传递其引用。这样，您可能希望将其重命名为<DynamicJSX />（出于约定）。

如果{dynamicJSX()}具有更多的util呈现方法而不是功能组件，则您也可以调用dynamicJSX。