ReactJS decide which component to use

Currently I have this code:

     {
      results && (
        isMultiple
          ? _.map(results, (itemData) => (<ItemMultiple
            key={itemData.key}
            data={itemData}
            loading={loading}
          />))
          : _.map(results, (itemData) => (<Item
            key={itemData.key}
            data={itemData}
            loading={loading}
          />))
      )
    }

If you see the props name are the same for both ItemMultiple and Item components.

How can I write that code in order to not repeat all the definition of the props, and only switch one those 2 Item components?

Answer

You can store the props in an object like this:

const myProps = {
    key: itemData.key,
    data: itemData,
    loading: loading,
}

and then using spread operator like this:

{
      results && (
        isMultiple
          ? _.map(results, (itemData) => (<ItemMultiple {...myProps} />))
          : _.map(results, (itemData) => (<Item {...myProps} />))
      )
    }