为什么排序这么慢（React）？答案

【问题标题】：Why is the sorting so slow (React)?为什么排序这么慢（React）？
【发布时间】：2022-07-21 20:43:57
【问题描述】：

我有以下问题：我有这个文件用于对填充了 100.000 行（但分页）的反应表进行排序。

现在，我有一列是用户的电子邮件。当我尝试对该列进行排序时，它就像即时排序一样。

但是当我尝试对计算访问次数的行进行排序时，它甚至没有排序（因为它太慢了）。

文件：

import { useState } from "react"

export type Order = "asc" | "desc"

const useSingleColumnSort = <T,>(
    defaultColumn: T,
    defaultOrder: Order = "desc"
) => {
    const [order, setOrder] = useState<Order>(defaultOrder)
    const [orderBy, setOrderBy] = useState<T>(defaultColumn)

    const toggleColumn = (col: T) => {
        if (col === orderBy) {
            setOrder(order === "asc" ? "desc" : "asc")
        } else {
            setOrderBy(col)
            setOrder(defaultOrder)
        }
    }

    return [order, orderBy, toggleColumn] as const
}

export default useSingleColumnSort

我做错了吗？是否有另一种选择可以更快地对其进行排序？顺便说一句，在我使用它的文件中，我也使用useMemo，但它不起作用。

【问题讨论】：

标签： reactjs react-native sorting react-hooks

【解决方案1】：

您似乎使用了外部库，您只设置了 order 道具还是重新排序了数据？在第一种情况下，您必须共享您的表代码和有关所涉及库的信息，否则您需要发布用于重新排序数据的函数。

【讨论】：