reactjs - What is the correct way to pass a complex object to a child component using props in React when writing in ES6? -

now have es6 , can use spread i've seen people write code this:

class parent extends component {   ...   render() {     return (       <userprofile {...this.props.user} onclick={this.dosomething} />     )   } }

this set each property of user model prop on userprofile component. alternative this:

<userprofile user={this.props.user} onclick={this.dosomething} />

is 1 of these approaches considered better practice? know version i'm leaning towards, want know if community has landed on doing 1 way or other.

few quick inputs -

obviously, spread better props not closely related, apart fact of them owned same component. complex object better suited grouping tightly coupled/grouped properties together, best example being style.
spread gives clarity, @ glance, can @ proptypes determine usage. if have lot of props, should @ possibility of grouping of them together.
the purpose of component has role too. userprofile component specific , implies several props related profile required. in case, i'd prefer complex object when data model available/constructible in parent component. however, if want support appearance or behavior related props, displayloginhistory etc, don't tie in data model, it'd better use spread keep coherent props.

Ben