fetch本地JSON档案,却无法成功map出资料

#1

使用fetch本地JSON档案,并且把它存在元件的state里面
在console.log的时候确实能看到JSON资料,不过却无法正确使用map渲染出来

JSON资料:

{
  "items": [{ "id": "1", "name": "Tom" }, { "id": "2", "name": "Mary" }]
}

元件:

class Home extends React.Component {
  state = {
    data: []
  };
  componentWillMount = () => {
    fetch("./data/one.json")
      .then(res => res.json())
      .then(result =>
        this.setState({
          data: result
        })
      );
  };
  render() {
    const list = this.state.data.items;
    return (
      <div>
        <h1>HOMEPAGE</h1>
        {list.map((data, i) => (
          <div key={i}>{data.name}</div>
        ))}
      </div>
    );
  }
}

export default Home;
#2

https://blog.csdn.net/jimolangyaleng/article/details/76999721
路径解析错误,解析不了所以json报错,你看看这个文档。

#3

你没有return。

#4

尝试了,也不是基于index.html,下一个

#5

谢谢各位的帮助,我找到问题点了,我在一开始的state没有定义里面
导致一开始list.map的时候发生错误
state={
data:{
items:[{ id:’ ‘,name:’ '}]
}
}
这样就能正常执行map了