frizefries
frizefries

Reputation: 29

Spread operator for props are not passing to component

I am having an issue passing spread operator props to components. Instead of returning a list with values, it is returning an empty list.

This is how I'm passing in my props to the component

const APIKey = "abc";
const url = "def";
const props = { APIKey, url}
return (
      <ProfileModal {...props} />
)

However, it is returning an empty list.

const FunctionName = (anotherPropIhave, props) => {
      const { APIKey, url } = props;
}

Upvotes: 0

Views: 327

Answers (2)

Hans Murangaza DRCongo
Hans Murangaza DRCongo

Reputation: 860

Try this:

const APIKey = "abc";
const url = "def";
const props = { APIKey: APIKey, url: url}
return (
      <ProfileModal {...props} />
)

Upvotes: 0

BeHappy
BeHappy

Reputation: 3978

React pass all props as first argument of react functional component. So This is an object.

Correct way to get other props is , ...props.

So:

const FunctionName = ({ anotherPropIhave, ...props }) => {
  const { APIKey, url } = props;
}

Upvotes: 5

Related Questions