[英]Issue in fetch nested datas from JSON.file
I have this db.json file which I want to render only the years on the screen. 我有这个db.json文件,我只想在屏幕上显示年份。 Like: 1999, 2000, 2001 and etc.
如:1999、2000、2001等。
JSON file: JSON文件:
{
"cronology":
[
{
"year": "1999",
"description": "This is a description text"
},
{
"year": "2000",
"description": "This is a description text"
},
{
"year": "2001",
"This is a description text"
},
{
"year": "2002",
"This is a description text"
}
]
}
I had tried this way how you can see in this react component below and it didn't work for me. 我已经尝试过这种方式,如何在下面的此React组件中看到它,但对我而言不起作用。
React Component file: React Component文件:
import React, { Component } from 'react'
import { Scrollbars } from 'react-custom-scrollbars'
var data = require('./db.json');
class Cronology extends Component {
constructor(props) {
super(props)
this.state = {
cronology: [],
year: "",
description: ""
}
}
componentDidMount() {
this.setState({
cronology: data.cronology
})
}
render() {
return (
<ul>
{
Objct.keys(this.state.cronology).map(
(i) => {
return <li>i.year</li>
})
}
</ul>
}
}
export default Cronology;
The screen didn't show any rendered data and there isn't any error message too. 屏幕上没有显示任何渲染的数据,也没有任何错误消息。 How can I solve it?
我该如何解决?
use only map 仅使用地图
render() {
const cronology = this.state.cronology || []; // validate cronology
return (
<ul>
{
cronology.map(
(i) => {
return <li>i.year</li>
})
}
</ul>
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.