Sign Up

Sign In

Forget Password

Lost your password? Please enter your email address. You will receive a link and will create a new password via email.

You must login to ask question.

Passing object as props to jsx

  • 0

I have an object contains multiple common key-value props, that I want to pass on to some jsx. Something like this:

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

I want this to function as passing individual props:

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

Is this possible?

Click to rate this post!
[Total: 0 Average: 0]
Share This Post
  1. Is this possible?

    Yes, why you think its not possible, but the way you are sending is not correct.

    Meaning of <MyJsx commonProps /> is:

    <MyJsx commonProps={true} />

    So if you don’t specify any value by default it will take true. To pass the object you need to write it like this:

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


    If you have an object and wants to pass all the properties as separate prop, write it like this:

    <MyJsx {...commonProps} />
    • 0
Leave an answer

Leave an answer