javascript - 使用map()读取Json对象

标签 javascript json reactjs object

我有一个如下所示的 json 对象 {"Title":"asb","Date":"2019","Other":"not important"} 读取此对象并在 <ul><li> 中渲染的正确方法是什么? ?

注意 我通过将其分配给状态并使用 map() 迭代状态来尝试此操作,但它不起作用。

最佳答案

map 只能与数组一起使用,不能与对象一起使用。首先使用Object.entries将对象转换为数组

const data = {"Title":"asb","Date":"2019","Other":"not important"}

const App = () => 
   <ul> 
     {
       Object.entries(data).map(([key, val]) => <li>{key}: {val}</li>)
     }
    </ul>
  
  
ReactDOM.render(<App />, document.getElementById('root'))
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
<div id="root"></div>

关于javascript - 使用map()读取Json对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55369694/

相关文章:

android - 在android中使用HttpPost发布JsonArray和字符串参数

sql - 可以使用 postgres 获取 json 数组中值的平均值吗?

javascript - 子组件不更新 Prop 更新

javascript - Img src 没有加载 react

javascript if语句如果url包含子字符串

php - 你如何处理 ', single quote in person' 的名字在 php,javascript

c# - 使用 Angular 发布将两个参数传递给 WEB API 调用

reactjs - 在 Formik 表单之外渲染 Formik 字段

javascript - 如何防止文本超出 div?

javascript - 为什么useSelector里面的选择器会运行两次?