logo

Ant Design Charts

  • 教程
  • 图表组件
  • 图表示例
  • 选项
  • 所有产品antv logo arrow
  • 2.0.0
  • 统计图表
    • 标题(Title)
    • 坐标轴(Axis)
    • 图例(Legend)
    • 滚动条(Scrollbar)
    • 缩略轴(Slider)
    • 提示信息(Tooltip)
    • 数据标签(Label)
    • 颜色映射(Color)
    • 事件(Event)
    • 交互(Interaction)
      • 概览
      • brushAxisHighlight
      • brushHighlight
      • brushXHighlight
      • brushYHighlight
      • brushFilter
      • brushXFilter
      • brushYFilter
      • chartIndex
      • elementHighlight
      • elementHighlightByColor
      • elementHighlightByX
      • elementSelect
      • elementSelectByColor
      • elementSelectByX
      • fisheye
      • legendFilter
      • legendHighlight
      • poptip
      • scrollbarFilter
      • sliderFilter
    • 状态(State)
    • 样式(Style)
    • 比例尺(Scale)
      • 概览
      • band
      • linear
      • log
      • ordinal
      • point
      • quantile
      • quantize
      • sqrt
      • threshold
      • time
      • pow
    • 动画(Animate)
      • 概览
      • fadeIn
      • fadeOut
      • growInX
      • growInY
      • morphing
      • pathIn
      • scaleInX
      • scaleInY
      • scaleOutX
      • scaleOutY
      • waveIn
      • zoomIn
      • zoomOut
    • 主题(Theme)
      • 概览
      • academy
      • classic
      • classicDark
    • 数据(Data)
      • 概览
      • custom
      • ema
      • fetch
      • filter
      • fold
      • inline
      • join
      • kde
      • log
      • map
      • pick
      • rename
      • slice
      • sort
      • sortBy

sortBy

上一篇
sort

Resources

Ant Design
Galacea Effects
Umi-React 应用开发框架
Dumi-组件/文档研发工具
ahooks-React Hooks 库

社区

体验科技专栏
seeconfSEE Conf-蚂蚁体验科技大会

帮助

GitHub
StackOverflow

more products更多产品

Ant DesignAnt Design-企业级 UI 设计语言
yuque语雀-知识创作与分享工具
EggEgg-企业级 Node 开发框架
kitchenKitchen-Sketch 工具集
GalaceanGalacean-互动图形解决方案
xtech蚂蚁体验科技
© Copyright 2025 Ant Group Co., Ltd..备案号:京ICP备15032932号-38

Loading...

对数据按照指定的字段进行排序。默认的排序方式为升序排列。

开始使用

const data = [
{ genre: 'Sports', sold: 275 },
{ genre: 'Strategy', sold: 115 },
{ genre: 'Action', sold: 120 },
{ genre: 'Shooter', sold: 350 },
{ genre: 'Other', sold: 150 },
];
{
"data": {
"value": data,
"transform": [ { type: 'sortBy', fields: ['sold'], // 根据 sold 字段排序 }, ]
}
}

当存在排序字段时,你可以为每一个字段提供一个布尔值 boolean 来改变排序方式,默认值为 true。

{
"data": {
"value": data,
"transform": [ { type: 'sortBy', fields: [['sold', false]], // 排序方式变为降序 }, ]
}
}

当存在多个排序字段时,若前一个字段相同,则继续比较下一个字段。

const options = {
fields: [
['name', true],
['age', false],
],
};
const data = [
{ name: 'Alice', age: 25 },
{ name: 'Bob', age: 23 },
{ name: 'Alice', age: 22 },
];

此结果按照 name 升序排列,而当 name 相同时,按照 age 降序排列

选项

属性描述类型默认值
fields排序的字段(string | [string, boolean])[][]