将对象作为道具传递给 jsx

Question

我有一个对象包含多个常见的键值道具，我想将其传递给一些 jsx。像这样的东西：

 const commonProps = {myProp1: 'prop1',myProp2: 'prop2'};
<MyJsx commonProps />

我希望它可以作为传递单个道具：

 <MyJsx myProp1={commonProps.myProp1} myProp2={commonProps.myProp2}/>

这可能吗？

原文由 Sabrina 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

这可能吗？

是的，它可能，但你发送它的方式不正确。

<MyJsx commonProps /> 的含义是：

 <MyJsx commonProps={true} />

因此，如果您不指定任何值，默认情况下它将采用 true 。要传递对象，您需要这样编写：

 const commonProps = {myProp1: 'prop1',myProp2: 'prop2'};
<MyJsx commonProps={commonProps} />

更新：

如果您有一个对象并希望将所有属性作为单独的 prop 传递，请这样编写：

 <MyJsx {...commonProps} />

原文由 Mayank Shukla 发布，翻译遵循 CC BY-SA 4.0 许可协议