如何在反应表中设置默认排序？答案

【问题标题】：How to set a default sorting in a react table?如何在反应表中设置默认排序？
【发布时间】：2021-01-19 23:24:38
【问题描述】：

我正在尝试对react-table v7 中的所有列进行默认排序并仅显示升序和降序，我尝试了以下操作

useTable(
    {
      columns,
      data,
      initialState: {
        sortBy: [
          columns.map((one) => {
            return {
              id: one.accessor ? one.accessor : one.id,
              desc: true,
            };
          }),
        ],
)

默认情况下，这确实会更改表格中的顺序，但排序图标不会出现在我这样写的列上

                 {column.isSorted ? (
                        column.isSortedDesc ? (
                          <ExpandLessIcon
                            fontSize="large"
                            style={{
                              transition: "250ms transform",
                              marginLeft: "7px",
                              fontSize: "20px",
                            }}
                            color="disabled"
                          ></ExpandLessIcon>
                        ) : (
                          <ExpandMoreIcon
                            fontSize="large"
                            style={{
                              transition: "250ms transform",
                              marginLeft: "7px",
                              fontSize: "20px",
                            }}
                            color="disabled"
                          ></ExpandMoreIcon>
                        )
                      ) : (
                        ""
                      )}

当我在控制台登录时，column.isSorted 仍然是 false。有人可以帮我解决这个问题吗？

【问题讨论】：

标签： reactjs react-table react-table-v7

【解决方案1】：

Array.map returns 一个新数组，它使sortBy 数组拥有另一个数组，这会导致问题。这行得通

        sortBy: columns.map((one) => {
          return {
            desc: false,
            id: one.accessor ? one.accessor : "",
          };
        }),

【讨论】：

嗨，我在 React 中遇到了一个与 React-Table 中的行排序有关的问题。你能给我一些想法在这种情况下如何对元素进行排序 - stackoverflow.com/q/68359658/1649217