javascript - onClick 不触发 react 功能组件内定义的函数

标签 javascript reactjs

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>)
      } 
    }

这是我的 react 功能组件,我试图在单击表头时调用两个函数 applySorting() 和 setHeaderClass() ,但是这些函数没有执行。当我尝试一次执行一个函数而不是两个时,它工作得很好。

最佳答案

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

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

关于javascript - onClick 不触发 react 功能组件内定义的函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43587141/

相关文章:

javascript - 将数组列表 javascript 中的图像修复为页面背景

javascript - 单击 PHP/Jquery 更新附加变量

javascript - 发送 post 请求时跨源请求被阻止

javascript - 从语义 UI 构建中删除未使用的模块/组件

javascript - Next.js 图像组件 Tailwind-css 不起作用

javascript - React - 动态表单字段,其中字段根据下拉菜单更改(使用 Hook )

javascript - reactJS 和读取文本文件

reactjs - 获取子组件的状态

javascript - React.js document.querySelectorAll() 不返回任何内容

javascript - 如何根据滚动位置更改类名?