javascript - 在 Github API 中按星数对用户存储库进行排序
问题描述
我正在构建一个 reactjs 应用程序来显示特定的用户存储库。我需要按星数对它们进行排序,但我不知道如何在 React 中进行。
这是给我星号的 api url:https ://api.github.com/users/cesar/repos
这是我的实际代码:
const UserRepositories = props => (
<div className="user-repos">
<ul>
<li>
<h2 className="repo-name">{props.repoName}</h2>
</li>
<li>
<p className="repo-description">{props.repoDescription}</p>
</li>
<li>
<span>
<FontAwesomeIcon icon={Star} className="icon" />
<span className="star-number">{props.starNumber}</span>
</span>
</li>
</ul>
</div>
);
这是我打印用户存储库的地图
<div className="col-md-8">
{githubRepo.map(name => (
<UserRepositories
key={name.id}
repoName={name.name}
repoDescription={name.description}
starNumber={name.stargazers_count}
/>
))}
</div>
解决方案
您可以sort
在调用函数之前使用该函数对存储库进行排序map
。
<div className="col-md-8">
{
githubRepo.sort((a, b) => {
if (a.stargazers_count > b.stargazers_count) return 1
else if (a.stargazers_count < b.stargazers_count) return -1
return 0
}).map(name => (
<UserRepositories
key={name.id}
repoName={name.name}
repoDescription={name.description}
starNumber={name.stargazers_count}
/>
))
}
</div>
推荐阅读
- uml - 我应该在我的用例图中包含系统作为参与者吗?
- sql - SQL获取日期之间的行数
- r - 警告消息:要替换的项目数不是替换长度的倍数
- javascript - Javascript 引号索引器
- r - 拉取后如何在 R 中编辑 CSV 文件中的数据?
- google-chrome-extension - Node.js 导入/导出和 chrome/opera/firefox 扩展。2020年的情况
- php - StripeObject.php array_keys() 期望参数 1 为数组,给定 null
- c# - 使用 BotServiceStressToolkit 和 MockChannel 进行 BotFramework 负载测试。从 MockChannel 获取数据的问题
- python - 如何将 Python Flask 后端连接到 React 前端?它是如何协同工作的?
- apache-spark - 别名内部加入pyspark