Реагировать |localeСравнить сортировку с нулевыми значениями

Question

Я использую React ant design table . В этой таблице я пытаюсь сортировать с нулевыми значениями, используя localeCompare Это показывает Ошибка типа.

JSON

const data = [{
  key: '1',
  name: null,
  age: 32,
}, {
  key: '2',
  name: 'Jim Green',
  age: '32',
}, {
  key: '3',
  name: 'Joe Black',
  age: 32,
}];

При сортировке я получаю сообщение об ошибке:

 TypeError: Cannot read property 'localeCompare' of null

У меня полный код на Кодовый ящик с песком

Answer 1

Вы можете проверить, является ли ваше значение null, тогда вы можете присвоить пробел, используя трубу.

В вашем коде вы можете сделать это следующим образом:

{
    title: "Name",
    dataIndex: "name",
    key: "name",
    sorter: (a, b) => {
        a = a.name || '';
        b = b.name || '';
        return a.localeCompare(b);
    }
},

DEMO

const data = [{
  key: '1',
  name: null,
  age: 32,
}, {
  key: '2',
  name: 'Jim Green',
  age: '32',
}, {
  key: '3',
  name: 'Joe Black',
  age: 32,
}];

console.log(data.sort((a,b)=>{
	a= a.name||'';
	b= b.name||'';
	return a.localeCompare(b)
}));

.as-console-wrapper {  max-height: 100% !important;  top: 0;}