如何對數據表的同一數組中的字符串和數字進行排序

Question

我正在使用 React 和 JavaScript 重建數據表，所以我正在對一些包括字符串和數字的信息進行排序，所以我一直在嘗試實現array.sort(a, b) => a.toLowerCase > b.toLoweCase... etc進行排序一切，在某些時候它可以完美運行，直到我單擊對數字進行排序的按鈕，因為它給了我一個錯誤，

沒有 tolowercase 函數，特定的排序號部分可以完美運行，但其他具有大寫和小寫字符串的部分不能正確排序

我怎么解決這個問題？

const useSortableData = (data, config = null) => {
const [sortConfig, setSortConfig] = useState(config);

  const sortedItems = useMemo(() => {
    let sortableItems = [...data];
    if (sortConfig !== null) {
      sortableItems.sort((a, b) => {
    const optionA = a[sortConfig.key].toString().toLowerCase()

    const optionB = b[sortConfig.key].toString().toLowerCase()

    if (optionA < optionB) {
      return sortConfig.direction === 'ascending' ? -1 : 1;
    }
    if (optionA > optionB) {
      return sortConfig.direction === 'ascending' ? 1 : -1;
    }
    return 0;
      });
    }
    return sortableItems;
  }, [data, sortConfig]);

  const requestSort = (key) => {
    let direction = 'ascending';
    if (
      sortConfig &&
      sortConfig.key === key &&
      sortConfig.direction === 'ascending'
    ) {
      direction = 'descending';
    }
    setSortConfig({ key, direction });
  };

  return { data: sortedItems, requestSort, sortConfig };
};

單擊數字排序部分時收到的錯誤

類型錯誤：a[sortConfig.key].toLowerCase 不是函數

更干凈的代碼

    const optionA = a[sortConfig.key].toString().toLowerCase()

    const optionB = b[sortConfig.key].toString().toLowerCase()

    if (optionA < optionB) {
      return sortConfig.direction === 'ascending' ? -1 : 1;
    }
    if (optionA > optionB) {
      return sortConfig.direction === 'ascending' ? 1 : -1;
    }
    return 0;

Answer 1

繼續對字母數字數據進行排序的評論：希望你不介意我稍微整理一下

  const sortedItems = useMemo(() => {
    let sortableItems = [...data];
    if (sortConfig !== null) {
      sortableItems.sort((a, b) => {
        let aString = a.toString().toLowerCase();
        let bString = b.toString().toLowerCase();

        if (sortConfig.direction === 'descending') {
          return bString.localeCompare(aString, 'en', { numeric: true })
        }
        
        // return default as ascending
        return aString.localeCompare(bString, 'en', { numeric: true })
      });
    }
    return sortableItems;
  }, [data, sortConfig]);