title: Delegate Pattern in React - how to achieve it?
body: <p>I'm mostly a C++ developer and I'm having a hard time understanding how can I create something as a 'Delegate' in React.</p>
  
  <p>What I wanna achieve: Pass a custom component to a Table Component that has the required code to edit the data on a table cell correctly.</p>
  
  <p>on my mainApp: </p>
  
  <pre><code>&lt;TableComponent 
      headerData=["first", "second", "third"]
      rowEditDelegates=[&lt;input/&gt;, &lt;button&gt;&lt;/button&gt;, &lt;combobox/&gt;]
  /&gt;
  </code></pre>
  
  <p>The code is much shorter for brievety.</p>
  
  <pre><code>class TableComponent extends React.Component {
      constructor(props) {
          super(props)
          this.state = {
              editDelegates = this.props.rowEditDelegates;
              displayEditors = false;
          }
  
          onEditToogled() {
               /* Here I have no idea how to get the editDelegates
                 and pass data to it. */
               setState({displayEditors : true});
          }
      }
  
      render() {
          let row = null;
          if(this.state.displayEditors) {
             row = this.state.editDelegates.map((item) =&gt; &lt;td&gt; {item} &lt;/td&gt;)
          } else {
             row = this.props.bodyData.map((item) =&gt; &lt;td&gt; {item} &lt;/td&gt;)
          }
      }
  };
  </code></pre>
  
  <p>I cannot access the delegate's methods because it's a rendered component, and I didn't understand how to work with a component "pointer" (I don't even know if it exists), maybe my problem needs a different mindset than a c++ programmer one.</p>