javascript - 不明白 Uncaught Typeerror Cannot Read Property of 0 Undefined？

Question

创建我的第一个 ReactJS 网站并在后端使用 Node，目前在接下来的代码中我获取数据，然后在页面上打印。我设法从服务器打印项目中人员的姓名、他们的照片和电子邮件，但我收到错误的项目描述:

TypeError: Cannot read property '0' of undefined

我不明白。

这是代码:

class ProjectPage extends Component {
constructor(props) {
    super(props);
    this.state = {
        user: [],
        description: [],
        mail: [],
        name: [],
    };
    this.getNames = this.getNames.bind(this);
    this.getPictures = this.getPictures.bind(this);
    this.getMails = this.getMails.bind(this);
    this.getDetails = this.getDetails.bind(this);
}

我创建了类和所有需要的元素

componentDidMount() {
    console.log("BEGIN componentDidMount");
    this.fetchDetails();
    this.fetchNames();
    this.fetchMails();
    console.log("END componentDidMount");
}

调用我的componentDidMount()中的所有函数

fetchDetails() {
    console.log("BEGIN fetchDetails()");

    let url = 'http://192.168.1.33:8080/getprojectdetails/Aprite';
    console.log("url details = " + url);

    fetch(url)
        .then(results => {
            var json = results.json();
            return json;
        })

        .then(data => {
            this.setState({ description: data });
        })

    console.log("END fetchData()");
}

这是项目描述的获取

getDetails = () => {
    let lines = [];
    let nbr = this.state.description.length;
    console.log("nbr = " + nbr);
    if (nbr){
        console.log("lines = " + this.state.description[0].P_Description);
        for (let i = 0; i < nbr; i++)
            lines.push(<div key={this.state.descripton[i].P_Description}></div>);
    }
    return (lines);
}

以及Render()函数中打印数据的函数

但是当我尝试打印这些数据时，nbr 的值从 0 变为 1，然后再次变为 0...在控制台日志中我可以看到描述，但它没有出现在网站上，而且我没有没明白。

请帮帮我？

Answer 1

getDetails 函数内部循环存在拼写错误
您应该编写 this.state.description 而不是 this.state.descripton

希望这能解决您的问题:)