从React App中的公用文件夹访问JSON

我有一个JSON文件,我想将其内容用于我的React App。

这是我的代码摘录

constructor(props){
    super(props);
    this.state = {
        entry : []
    }
}

componentDidMount(){
    fetch(process.env.PUBLIC_URL + `./js/data.json`)
    .then(res => res.json())
     .then(json => this.setState({ entry: json }));
}
class Data extends Component{
render(){
    return(
        <div>
            <ul>
                {this.state.entry.map( x => (
                    <li>
                        <div className='centering'>
                            <span>
                                <img alt='' key={x.img} src={process.env.PUBLIC_URL + `./img/${x.img}.jpg`}/>
                            </span>
                            <span className='txt'>
                                { x.date }
                            </span>
                            <span>
                                <p>{ x.ctx }</p>
                            </span>
                        </div>
                        <div className='hr-line'></div>
                    </li>
                ))}
            </ul>
        </div>
    );
}

}

这是我的data.json的内容

{
"entry" : {
    "2" : [
        {
            "date":"1/1/1",
            "img":"profile",
            "ctx":"as"
        }

    ],
    "1" : [
        {
            "date":"1/1/1",
            "img":"profile",
            "ctx":"as"
        }

    ]
}

When I save the file, on the browser it shows TypeError: this.state is null

是否缺少某些东西,或者不可能做到?

先感谢您。

评论