我正在通过映射我的数据创建一个表,我正在尝试创建一个 TableSortLable
,但我只想让用户能够按前两列进行排序。
{
Columns.map(c,index => {
return (
<TableCell key={c.key} component="th" padding="checkbox">
<TableSortLabel
active={props.brokersListOrderByColumn === c.key}
direction={props.brokersListSortOrder}
onClick={() => props.setOrderBy(c.key)}>
{c.label}
</TableSortLabel>
</TableCell>
)
})
}
我正在考虑使用 onClick
事件,并且仅在第一列或第二列时启用它。我试过类似的东西:
{(index === 1 || index ===2) && onClick={() => props.setOrderBy(c.key)}}>
或者有条件地设置 onClick
值,但两者都不起作用。
我也试过有条件地设置 TableSortOrder
:
<TableCell key={c.key} component="th" padding="checkbox">
{(index === 1 || index === 2) && <TableSortLabel
active={props.brokersListOrderByColumn === c.key}
direction={props.brokersListSortOrder}
onClick={() => props.setOrderBy(c.key)}>
{c.label}
</TableSortLabel>}
{(index !== 1 && index !== 2) && c.label}
</TableCell>
但它提示 c
未定义
最佳答案
语法错误。您应该为仿函数编写括号中的参数。像这样
Columns.map((c, index) => {...
否则引擎将尝试查找 (RHS) 变量 c(预期为函数)。 你没有初始化这样的变量并得到这个
But it complains c is undefined .
关于javascript - 如何有条件地启用 onClick,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52024221/