Question

for循环有点麻烦。这个程序从我的后端收集数据，并且应该遍历数据。但是，循环仅显示1 _id，而console.logging显示两个10。我感谢高级提供的帮助，感谢所有提示/批评。

**问题似乎出在i ++ ...如果我每次登录我，它都保持为0！

import React, { Component } from 'react';
import getTransactions from '../api/TransactionAPI';

export class Dashboard extends Component {

state = {
    transactions: ""
}

componentDidMount() {
    getTransactions().then(res => {
        this.setState({ transactions: res.data });
      }).catch(error => {
        console.log(error)
      });
}

mapData(data) {
    for (let i = 0; i < data.length; i++) {
        console.log(data.length);
        return <h1>{data[i]._id}</h1>
    }
}

render() {
    if (this.state.transactions === "") {
        return (
            <p>loading...</p>
        )
    } else {
        return (
            <div>
                { this.mapData(this.state.transactions) }
            </div>
        )
    }
}

}

export default Dashboard;

Answer 1

您没有从mapData返回任何信息。试试

mapData(data) {
   const elements = [];
   for (let i = 0; i < data.length; i++) {
       console.log(data.length);
       elements.push(<h1>{data[i]._id}</h1>)
   }

   return elements;
}

另外，可以使用data代替for循环（对.map作一些假设）。

mapData(data) {
    return data.map(d => (
        <h1>{d._id}</hi>
    ))
}

React for循环仅运行两次

1 个答案: