1
const ResultsTableViewComponent = ({data,applySorting,sorting,loading}) =>
{if(loading == true){
return <h1></h1>
}else{
return (<table className="mdl-data-table mdl-js-data-table mdl-data-table--selectable mdl-shadow--2dp">
<thead>
<tr>
<th>Model</th>
<th className={setClass[0]} onClick={(event)=>{applySorting('buy_requests'),setHeaderClass(0)}}>Buy Requests</th>
<th className={setClass[1]} onClick={(event)=>{applySorting('median_price'),setHeaderClass(1)}}>Median Price </th>
<th className={setClass[2]} onClick={(event)=>{applySorting('median_age'),setHeaderClass(2);}}>Median Age </th>
<th className={setClass[3]} onClick={(event)=>{applySorting('page_visits'),setHeaderClass(3);}}>Page Visits </th>
<th className={setClass[4]} onClick={(event)=>{applySorting('listings_count'),setHeaderClass(4);}}>Listing Count </th>
<th className={setClass[5]} onClick={(event)=>{applySorting('leads_count'),setHeaderClass(5);}}>Leads Count</th>
</tr>
</thead>
<tbody>
{data.map((item, i) =>
<tr key={i}>
<td>{item.x}</td>
<td>{item.percentage.buy_requests ? `${item.percentage.buy_requests.toFixed(2)}`:""}% ({item.value.buy_requests})</td>
<td>{item.value.median_price}</td>
<td>{item.value.median_age}</td>
<td>{item.percentage.page_visits ? `${item.percentage.page_visits.toFixed(2)}`:""}%({item.value.page_visits})</td>
<td>{item.percentage.listings_count ? `${item.percentage.listings_count.toFixed(2)}`:""}%({item.value.listings_count})</td>
<td>{item.percentage.leads_count ? `${item.percentage.leads_count.toFixed(2)}`:""}%({item.value.leads_count})</td>
</tr>
)}
</tbody>
</table>)
}
}
這是我反應的官能成分,我想在表頭的點擊調用兩個函數applySorting()和setHeaderClass(),但不執行的功能。當我嘗試一次執行一個函數而不是兩個時,它可以正常工作。裏面定義的onClick不點火功能反應的官能comonent