Question

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（）但是，函数不会被执行。当我尝试一次执行一个函数而不是两个时，它工作正常。

Answer 1

只需将,替换为回调函数中的;。

<th className={setClass[0]} onClick={(event)=>{applySorting('buy_requests');setHeaderClass(0)}}>Buy Requests</th>

onClick不在反应功能组件内定义的触发功能

1 个答案: