onClickのプロパティを設定する

Question

ヘッダー列onClickedのdisplay styleをnoneの下に設定して列が消えるようにするにはどうすればよいですか？

class StockTable extends React.Component { 
    constructor(props) { 
     super(props); 
     this.state = {hidden: []}; 
    } 
    //Make the column header clicked dissapear 
    handleClickTableHeaderColumn(i) { 
      //**How do I get the column clicked and change the display property?** 
      console.log(this);//this.state.hidden[i].event + this.state.hidden[i].name); 
    } 
    render() {   
     var items = []; 
     for (var symbol in this.props.stocks) { 
      var stock = this.props.stocks[symbol];   
      items.push(<StockRow key={stock.symbol} stock={stock} bid={this.props.bid} ask = {this.props.ask} last={this.props.last}/>); 

     }    

     return (  
      <table table-head id="stocktable"> 
       <colgroup> 
        <col class="maroon" />      
       </colgroup> 
       <tbody> 
       <tr>      
        <th></th> 
        <th onClick={(i) => this.handleClickTableHeaderColumn(i)}>P/M</th> 
        <th onClick={(i) => this.handleClickTableHeaderColumn(i)}>T</th> 
        <th onClick={(i) => this.handleClickTableHeaderColumn(i)}>K</th> 

Answer 1

私は考え出し：

CSS私はちょうど実現

.none { 
    display: none; 
} 

handleClick(event) { 
     event.currentTarget.style.display = 'none';