オブジェクト属性内でイベント関数を処理する方法は？

Question

こんにちは私は、テーブル行をクリックすると別のURLに移行する必要があるWebアプリケーションのためにブートストラップテーブルを使用しています。 「オン・クリック」イベントは、onRowClickというオブジェクト属性を使用して処理されます。この属性には、行データを引数として受け取る関数が割り当てられます。

onRowClick：機能

は、行をクリックした後に呼び出されるコールバック関数を割り当てます。 この関数は1つの引数をとります：rowはあなたがクリックした行データです。内部

displaySystemInfo(row, event) { 
    event.preventDefault(); 
    const systemId = row._id; 
    this.context.router.transitionTo(`/system/${systemId}`) 
} 

：私はこのようにそれをやろうとしてきた

onRowClick: function(row) { 

} 

：私が行うことができるようにしたいどのような

class SystemTable extends React.Component { 
constructor() { 
    super(); 

    this.state = { 
     data: sampleSystems 
    } 
} 

displaySystemInfo(row) { 
    const systemId = row._id; 
    this.context.router.transitionTo(`/system/${systemId}`); 
    //browserHistory.push(`/system/${systemId}`); 
} 

render() { 
    function osName(cell, row) { 
     return cell.name; 
    } 

    function batteryCondition(cell, row) { 
     return cell.condition; 
    } 

    var selectRowProp = { 
     mode: "checkbox", 
     bgColor: "rgb(204, 230, 255)" 
    }; 

    var tableOptions = { 
     sizePerPage: 5, 
     deleteText: "✗ Delete Selected", 
     paginationSize: 3, 
     clearSearch: true, 
     hideSizePerPage: true, 
     onRowClick: function(row) { 
      // here 
     } 
    }; 

    return (
    <BootstrapTable 
     className="react-bs-table" 
     data={this.state.data.systems} 
     striped={true} 
     hover={true} 
     pagination={true} 
     selectRow={selectRowProp} 
     deleteRow={true} 
     multiColumnSearch={true} 
     search={true} 
     ignoreSinglePage={true} 
     options={tableOptions} 
     > 
     <TableHeaderColumn dataField="_id" isKey={true} dataAlign="center" 
      searchable={false}>ID</TableHeaderColumn> 
     <TableHeaderColumn dataField="serialnumber" dataAlign="center" 
      searchable={false}>Serial Number</TableHeaderColumn> 
     <TableHeaderColumn dataField="model" dataAlign="center" 
      dataSort={true}>Model</TableHeaderColumn> 
     <TableHeaderColumn dataField="os" dataAlign="center" dataSort={true} 
      dataFormat={osName} filterValue={osName}>OS</TableHeaderColumn> 
     <TableHeaderColumn dataField="battery" dataAlign="center" dataSort={true} 
      dataFormat={batteryCondition} filterValue={batteryCondition}> 
      Battery Condition</TableHeaderColumn> 
    </BootstrapTable> 
    ) 
} 

SystemTable.contextTypes = { 
    router: React.PropTypes.object 
} 

export default SystemTable; 

はこのような関数を呼び出している

onRowClick: function(row) { 
    (e) => this.displaySystemInfo(row, e); 
} 

でも動作しませんその単純な修正ですが、私はonRowClick属性内のイベントをどのように処理するか分かりません。どんな助けでも感謝しています！

EDIT

が、私は「それは動作しません」によって何を意味するか言及を忘れ、私は次の警告を得る：

warning Expected an assignment or function call and instead saw an expression no-unused-expressions 

を、何もクリック時に発生しません。

Answer 1

は、なぜあなたはe.preventDefaultが必要なのでしょうか？それはちょうど

onRowClick: this.displaySystemInfo 

または

onRowClick: function(row) { 
    const systemId = row._id; 
    this.context.router.transitionTo(`/system/${systemId}`) 
} 

onRowClickが自動的に行データを渡しますが、のTableRowソース内のクリックハンドラは、クリックイベント情報をつかんで操作するためのフックを提供していませんしませんする必要があります直接。

Answer 2

は、あなたは試してみました：

onRowClick: function(row) { 
    retrun displaySystemInfo(row, e); 
}