title: How to render a stateless component before mounting?
body: <p>Currently I'm generating the <code>Table</code> component upon clicking the button, but I want the table to generate right as I load the page. Here is the parent component that I click to generate the table. </p>
  
  <pre><code>render() {
  return (
      &lt;div&gt;
          &lt;button onClick={this.sellItem}&gt;
             Sell Item
          &lt;/button&gt;
          &lt;Tables sellers={this.state.sellers} /&gt;
      &lt;/div&gt;
      )
  }
  </code></pre>
  
  <p>Here is the table (stateless component) that I'm generating upon clicking the button. </p>
  
  <pre><code>export default ({ sellers, header }) =&gt; {
  return (
  &lt;div&gt;
    &lt;Table&gt;
      &lt;TableHeader&gt;
        &lt;TableRow&gt;
          {
            header.map((headerName, index) =&gt; {
              return (
                &lt;TableHeaderColumn key={`thc-${index}`}&gt;
                  {headerName.name}
                &lt;/TableHeaderColumn&gt;
              )
            })
          }
          &lt;TableHeaderColumn /&gt;
        &lt;/TableRow&gt;
      &lt;/TableHeader&gt;
      &lt;TableBody&gt;
        {sellers.map((currentValue, index) =&gt;
          &lt;TableRowColumn&gt;{currentValue}&lt;/TableRowColumn&gt;
        )}
      &lt;/TableBody&gt;
    &lt;/Table&gt;
  &lt;/div&gt;
    )
  }
  </code></pre>
  
  <p>How can I generate this table upon loading my parent component? I can't render things in the <code>componentWillMount</code>, so what do I do?</p>