花括号外的传播算子有什么作用？

Question

这来自我的React项目，这是我从未见过的东西：

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

具体来说，我指的是花括号的散布运算符。我习惯在里面看到它们。

Answer 1

在你的例子中

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

相当于

return <ExperienceList {…this.props} />

它做同样的事情，这是

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