reactjs - 将对象作为 props 传递给 jsx

Question

我有一个对象包含多个常见的键值属性，我想将其传递给一些 jsx。像这样的事情:

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

我希望它能够作为传递单独的 Prop :

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

这可能吗？

Answer 1

Is this possible?

是的，这是可能的，但您发送的方式不正确。

<MyJsx commonProps />的含义是:

<MyJsx commonProps={true} />

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

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

更新:

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

<MyJsx {...commonProps} />