What does ... in this React code (using JSX) and what is it called?
<Modal {...this.props} title='Modal heading' animation={false}>... are called spread attributes which, as the name implies, allow an expression to be expanded.
let parts = ['two', 'three']; let numbers = ['one', ...parts, 'four', 'five']; // ["one", "two", "three", "four", "five"]And in this case (I'm going to simplify it).
// Just assume we have an object like this: var person= { name: 'Alex', age: 35 }Is:
<Modal {...person} title='Modal heading' animation={false} />is equal to
<Modal name={person.name} age={person.age} title='Modal heading' animation={false} />
So, in short, it's a neat shortcut, we can say .