Не удается прочитать свойство 'sortFunc' из неопределенного при попытке отрисовки таблицы реакции-начальной загрузки TableHeaderColumn

Question

Я пытаюсь визуализировать таблицу реакции-загрузки TableHeaderColumn с помощью функции карты. Получение сообщения об ошибке «sortFunc» не определено. Работает нормально, если я жестко закодирую TableHeaderColumn.

Я попытался создать фиктивную sortFunc, чтобы она не была неопределенной в элементе реакции перед рендерингом. Не сработало.

colhdr = [
[0, 'ID',{'fieldname':'ID','label':'ID', 'iskey':true }],
[1, 'username',{'fieldname':'username','label':'User Name',  'iskey':false}],]


var columnelems = this.state.tablehdr.map ((colhdr) => {
  return (
      <TableHeaderColumn dataAlign='center' dataField={colhdr[1]} key={colhdr[0]} isKey={colhdr[2].iskey}>{colhdr[2].label}</TableHeaderColumn>
  )
});

return (
<div>
  <div class="col-xs-9 col-md-11 ml-5">
  <BootstrapTable bootstrap4 data = { this.state.tabledata }
                  height          = '40%'
                  options         ={ options }
                  selectRow       = { selectRowProp }
                  tableStyle      = { { border: 'LightSlateGrey 2.5px solid' } }
                  bodyStyle       = { { height: '87%'} }
                  hover
                  scrollTop       = { 'Bottom' }>
          {columnelems}
  </BootstrapTable>
  </div>

Если я заменю {columnelems} на жестко закодированные элементы TableHeaderColumn, все будет работать нормально.

Answer 1

У меня была точно такая же проблема сегодня, и это было потому, что options реквизит, который я передавал BootstrapTable, был неправильным. Мои варианты были:

options = {
  defaultSortName: 'foo',
  defaultSortOrder: 'asc',
};

Но foo не существовало в моих объектах, которые я передавал таблице, вызывая эту ошибку.