javascript - react 不渲染AJAX数据

我正在尝试使用react将数据加载到表中，并且在尝试渲染片段时已经到了数据确实存在的地步，但是，它似乎并没有真正更新dom和渲染（我已经测试并知道了实际上，当数据在tbody下的{}块中运行片段时，确实存在，任何帮助都将是非常棒的，谢谢。

import React from 'react';

class InvoicePickTable extends React.Component {

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

    getInvoiceData(){
        return new Promise(function(resolve, reject) {
            console.log("hi");
            resolve([{number: "1"},{number: "2"},{number: "3"}]);
        })

    }
    componentDidMount() {
        const self = this;
        self.getInvoiceData()
        .then((response) => {
            self.setState({invoices: response});
        })
        .catch((err) => {
            console.error(err);
        });
    }
    render() {
        return (
            <table>
                <thead>
                    <tr>
                        <th>Invoice #</th>
                        <th>Task Price</th>
                        <th>Balance</th>
                        <th>Task Name</th>
                    </tr>
                </thead>
                <tbody>
                {

                    this.state.invoices.forEach(function (invoice) {
                        console.log("in");
                        console.log(invoice);
                        return (
                            <tr>
                                <td>{invoice.number}</td>
                            </tr>
                        );
                    })
                }
                </tbody>
            </table>
        );
    }

}

export default InvoicePickTable;

最佳答案

采用

this.state.invoices.map(invoice => <tr><td>{invoice.number}</td></tr>)

在渲染功能中。 Array.forEach实际上不返回数组