admin管理员组

文章数量:1023838

This es from my React project, and is something I’ve never seen before:

const { list, loading, failed } = this.props
return <ExperienceList {…{ list, loading, failed }} />

Specifically, I’m referring to the spread operator OUTSIDE of the curly braces. I’m used to seeing them inside.

This es from my React project, and is something I’ve never seen before:

const { list, loading, failed } = this.props
return <ExperienceList {…{ list, loading, failed }} />

Specifically, I’m referring to the spread operator OUTSIDE of the curly braces. I’m used to seeing them inside.

  • javascript
  • reactjs
Share Improve this question edited Aug 16, 2019 at 19:31 Get Off My Lawn 36.4k46 gold badges198 silver badges376 bronze badges asked Aug 16, 2019 at 19:27 TycholizTycholiz 1,2005 gold badges18 silver badges38 bronze badges 4
  • Probably it means: 1) pick only those 3 keys from the original props and then 2) do the spreading as usual, i.e. apply those 3 props to the poment. IMHO – Hero Qu Commented Aug 16, 2019 at 19:30
  • You are deconstructing the object into another object. – Get Off My Lawn Commented Aug 16, 2019 at 19:30
  • 1 Possible duplicate of What do these three dots in React do? – Emile Bergeron Commented Aug 16, 2019 at 19:41
  • 1 not a duplicate; my question is related to how it works when the '...' is preceded by an object – Tycholiz Commented Aug 16, 2019 at 23:45
Add a ment  | 

1 Answer 1

Reset to default 10

In your example

return <ExperienceList {…{ list, loading, failed }} />

is equivalent to

return <ExperienceList {…this.props} />

it does the same thing, which is

return <ExperienceList list={list} loading={loading} failed={failed} />

This es from my React project, and is something I’ve never seen before:

const { list, loading, failed } = this.props
return <ExperienceList {…{ list, loading, failed }} />

Specifically, I’m referring to the spread operator OUTSIDE of the curly braces. I’m used to seeing them inside.

This es from my React project, and is something I’ve never seen before:

const { list, loading, failed } = this.props
return <ExperienceList {…{ list, loading, failed }} />

Specifically, I’m referring to the spread operator OUTSIDE of the curly braces. I’m used to seeing them inside.

  • javascript
  • reactjs
Share Improve this question edited Aug 16, 2019 at 19:31 Get Off My Lawn 36.4k46 gold badges198 silver badges376 bronze badges asked Aug 16, 2019 at 19:27 TycholizTycholiz 1,2005 gold badges18 silver badges38 bronze badges 4
  • Probably it means: 1) pick only those 3 keys from the original props and then 2) do the spreading as usual, i.e. apply those 3 props to the poment. IMHO – Hero Qu Commented Aug 16, 2019 at 19:30
  • You are deconstructing the object into another object. – Get Off My Lawn Commented Aug 16, 2019 at 19:30
  • 1 Possible duplicate of What do these three dots in React do? – Emile Bergeron Commented Aug 16, 2019 at 19:41
  • 1 not a duplicate; my question is related to how it works when the '...' is preceded by an object – Tycholiz Commented Aug 16, 2019 at 23:45
Add a ment  | 

1 Answer 1

Reset to default 10

In your example

return <ExperienceList {…{ list, loading, failed }} />

is equivalent to

return <ExperienceList {…this.props} />

it does the same thing, which is

return <ExperienceList list={list} loading={loading} failed={failed} />

本文标签： javascriptWhat does spread operator outside of curly braces doStack Overflow

版权声明：本文标题：javascript - What does spread operator outside of curly braces do? - Stack Overflow 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://it.en369.cn/questions/1745525893a2154522.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。