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

标签 reactjs jsx react-props

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

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

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

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

这可能吗?

最佳答案

Is this possible?

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

<MyJsx commonProps />的含义是:

<MyJsx commonProps={true} />

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

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

更新:

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

<MyJsx {...commonProps} />

关于reactjs - 将对象作为 props 传递给 jsx,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49081549/

相关文章:

javascript - 当状态改变时 prop 不会更新

javascript - 无法调用 props 子函数

reactjs - ReactNative.createClass 已弃用,请使用 "React"包中的 React.createClass 代替

css - 如何更改Ag网格边框颜色?

javascript - 如何有条件地格式化 react 管理中字段的标签?

reactjs - 将样式组件与语义 UI react 一起使用时出现警告 : Prop `className` did not match.

javascript - 从网格中过滤记录时出错

javascript - AWS s3 存储桶上的 React-Router 位置不起作用

javascript - 将 Prop 从一个组件传递到另一个组件时出错 - 使用 typescript 进行 react 时反之亦然

javascript - 为什么将未定义的 react Prop 传递给子组件?