首页 > 解决方案 > 如何在 Javascript 中对 Array map() 函数输出进行排序

问题描述

我想在使用 map() 函数后对项目进行排序。但是排序必须基于特定项目的属性。那么在将索引传递给“key”之前如何自定义索引呢?

这里是来自 API 的响应

[
  {
    "typeId": 2,
    "count": 410
  },
  {
    "typeId": 3,
    "count": 2
  },
  {
    "typeId": 4,
    "count": 19
  },
  {
    "typeId": 5,
    "count": 21
  },
  {
    "typeId": 6,
    "count": 1
  },
  {
    "typeId": 7,
    "count": 80
  }
   ...
]

数据利用

 <div className="top-error-ctn">
  <span className="heading">Top Errors</span>
  <p>
    Sorted By Type
  </p>
  <div className="row">
     {Sometest ? (
       all.slice(0, 6).map((all, index) => {
          return <ErrorBar key={index} all={all} />;
       })
     ) : (
       <span>Nothing to see</span>
     )}
  </div>
</div>

数据渲染

<div>
  <div className="side">
    <div>{all.typeId}</div>
  </div>
  <div className="middle">
    <div className="bar-container">
      <div className="bar-5"></div>
    </div>
  </div>
  <div className="side right">
    <div>{all.count}</div>
  </div>
</div>

标签: javascriptarraysreactjs

解决方案


你可以这样排序

all.sort(function(a, b) {
    return b.count- a.count;
});

推荐阅读