title: What is the correct way to pass a complex object to a child component using props in React when writing in ES6?
body: <p>Now that we have ES6 and can use spread I've seen some people write code like this:</p>
  
  <pre><code>class Parent extends Component {
    ...
    render() {
      return (
        &lt;UserProfile {...this.props.user} onClick={this.doSomething} /&gt;
      )
    }
  }
  </code></pre>
  
  <p>This would set each property of user model as a prop on the UserProfile component. The alternative would be something like this:</p>
  
  <pre><code>&lt;UserProfile user={this.props.user} onClick={this.doSomething} /&gt;
  </code></pre>
  
  <p>Is one of these approaches considered the better practice? I know which version I'm leaning towards, but I want to know if the community has already landed on doing it one way or the other.</p>