如何在反应 table 中设置默认排序？

Question

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

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

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

                 {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。有人可以帮我解决这个问题吗？

Answer 1

Array.map returns 一个新数组，它使 sortBy 数组具有另一个数组，这会导致问题。这有效

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

如何在反应 table 中设置默认排序？

How to set a default sorting in a react table?

reactjs

react-table

react-table-v7