时间戳

首页 > 解决方案 > 根据 JSON 中的键值呈现元素

javascript - 根据 JSON 中的键值呈现元素

问题描述

假设我有 json 文件，

[
    {"page":"about","title":"About","order":"0"},
    {"page":"another-test","title":"Another Test"},
    {"page":"how-to","title":"How To","order":"1"},
    {"page":"test-page","title":"Test page","order":"2"}
]

在这里，你看到一个 key order，当我映射这个 json 文件时，我想先渲染一个order价值较小的文件。例如，

import myJSON from 'file.json'

....
myJSON.map(({ page, title }) => (
   <h1 key={page}>{title}</h1>
))
....

如何使用order密钥并呈现具有较小order值或升序的密钥？

标签： javascriptjsonnext.js

解决方案

您可以根据顺序对它们进行排序。

myJSON.sort((a, b) => parseInt(a.order) - parseInt(b.order))

myJSON.map(({ page, title }) => (
   <h1 key={page}>{title}</h1>
))

推荐阅读