Question

我有一个Material UI表，允许对列进行排序。我的专栏如下：

const columnData = [
    { id: 'name', numeric: false, disablePadding: true, label: 'Fichier' },
    { id: 'lecture', numeric: false, disablePadding: false, label: 'Lecture' },
    { id: 'tags', numeric: true, disablePadding: false, label: 'Tags' },
    { id: 'creation_time', numeric: true, disablePadding: false, label: 'Date d\'ajout' },
    { id: 'action', numeric: false, disablePadding: false, label: 'Action' },
];

我希望能够只按名称排序＆＃39;和＆＃39; creation_time＆＃39;。但是，排序方法不一样，因为name是字母数字而creation_time是日期

我已经创建了我的功能，现在他们只需添加＆＃34;功能x点击＆＃34;当我尝试每一个时，在控制台中，但我希望在正确的时间只有两个。这是我到目前为止的尝试方式：

<TableSortLabel
 active={orderBy === column.id}
 direction={order}
 onClick={() => { column.id === 'name' ?
 this.createSortNameHandler(column.id) :
 column.id === 'creation_date' ?
 this.createSortDateHandler(column.id) : console.log('nope')}}
 >

如果我没有犯错，这应该是（大致）

的等价

if(column.id === 'name') {
  onClick = this.createSortNameHandler(column.id);
else if(column.id === 'creation_date') {
  onClick = this.createSortDateHandler(column.id);
} else {
console.log('nope');
}

到目前为止，当我点击＆＃39; Fichier＆＃39; /＆＃39;名字＆＃39;，我什么都没得到，但是一旦我点击其他任何东西，我就会得到＃no;＆＃39;。

我该怎么做才能解决这个问题？提前谢谢

Answer 1

您正在创建排序处理程序，但不是在调用它们。试试这个：

onClick={() => {
  (column.id === 'name' ? this.createSortNameHandler(column.id) :
    (column.id === 'creation_date' ? this.createSortDateHandler(column.id) :
      () => { console.log('nope') }
    )
  )()
}}

或者更简单的版本：

onClick={column.id === 'name' ?
  this.createSortNameHandler(column.id) :
  (column.id === 'creation_date' ? this.createSortDateHandler(column.id) :
    () => { console.log('nope') }
  )
}}

无法设置条件onClick行为

1 个答案: