'Conditionally pick a prop to use

const Component = ({

    const someBoolean 

    return (
          <Component
             prop1
             prop2

I want to use prop1 ONLY when someBoolean is true, otherwise prop2 should be used. What is the best way to do this ?

So say someBoolean is true I would have

const Component = ({

    const someBoolean 

    return (
          <Component
             prop1

Otherwise I would have

const Component = ({

    const someBoolean 

    return (
          <Component
             prop2


Solution 1:[1]

You can use spread operator.

const Component = ({
    const someBoolean;
    const finalProp = someBoolean ? prop1 : prop2;   

    return (
          <Component {...finalProp} />
    )
})

Solution 2:[2]

const Component = ({

    const prop = someBoolean ? prop1 : prop2 

    return (
          <Component {...prop} />
})

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Shahriar
Solution 2