Javascript 从JSON.file获取嵌套数据时出现问题

我有一个db.json文件，我只想在屏幕上显示年份。例如：1999年、2000年、2001年等

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"
        }
      ]
    }

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;

我试过这样的方法，你可以看到下面这个反应组件，但它不适合我

React组件文件：

  {
   "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"
        }
      ]
    }

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;

import React，{Component}来自“React”
从“react custom Scrollbars”导入{Scrollbars}
var data=require（'./db.json'）；
类Cronology扩展组件{
建造师（道具）{
超级（道具）
此.state={
权杖学：[]，
年份：“，
说明：“”
}
}
componentDidMount（）{
这是我的国家({
权变学：数据。权变学
})
}
render（）{
返回(

{
key（this.state.cronology）.map(
（i） =>{
返回
i.year
})                  
}

}
}
导出默认密码；

屏幕上没有显示任何渲染数据，也没有任何错误消息。如何解决此问题？

仅使用地图

render() {

  const cronology = this.state.cronology || []; // validate cronology

  return (
    <ul>
      {
        cronology.map(
        (i) => {
          return <li>i.year</li>
      })                  
    }
  </ul>            
}

render（）{
const cronology=this.state.cronology | |[]；//验证cronology
返回(

{
cronology.map(
（i） =>{
返回
i.year
})                  
}

}