title: How to create a sortable table in React? How to access class method from the sorted objects?
body: <p>I have an array of objects. i want to access class method inside object function property. How to implement this? please help me. I wrote smth like this:</p>
  
  <pre><code>render() {       
    tableTh = [
      {name: i18n.t('ExtendedModalBar.naming'), style:{},  handleSort () {}},
        ...
    ]
    ...
  }
  </code></pre>
  
  <p>I am trying to write someth like this: </p>
  
  <pre><code>class Table extends Component {
  
    handleSort() {
  
    }
    ...
  
    render() {
    }
  
  }
  </code></pre>
  
  <p>My table headers are formed dynamically:</p>
  
  <pre><code>&lt;thead&gt;
    &lt;tr&gt;
      &lt;th style={{ width: "50px" }}&gt;
        &lt;Checkbox
          checked={this.state.selectedAll}
          onChange={() =&gt; this.selectAll()}
        /&gt;
      &lt;/th&gt;
      {tableTh.map((obj, index) =&gt; {
        return (
          &lt;th key={index.toString()} style={obj.style} onClick={obj.handleSort}&gt;
            {obj.name}
          &lt;/th&gt;
        );
      })}
    &lt;/tr&gt;
  &lt;/thead&gt;        
  </code></pre>
  
  <p>I must implement sorting of table columns. If tables are formed statically it is easy to attach onclick to th tag. but if code was written like this, i am stuck.  How to write method in the class that will be accessible from inside property of objects (array of objects) ?   And I need sorting in both directions ascending and descending. My table column should change own sorting direction when I click on its table header. Any answers will be taken into acccount. Thanks in advance</p>