Javascript 在react.js中获取承诺数据。状态为空。为什么？

从CSV文件获取数据时出现问题。这是我的密码：

constructor(props) {
        super(props);
        this.state = {
            data: [],
            isLoading: false,
        };
        console.log(this.state.data) // Data is gone =(
    }

toCSV(response){
        let reader = response.body.getReader();
        let decoder = new TextDecoder('utf-8');

        return reader.read().then(function (result) {
            let data = decoder.decode(result.value);
            let results = Papa.parse(data);
            let rows = results.data;
            return rows;
        });
    }

componentDidMount() {
        this.setState({ isLoading: true });
        let dataNames;
            return fetch('url/someFile.csv')
            .then(response => this.toCSV(response))
            .then(data => console.log(data)) // Data is here
            .then(data => this.setState(
                { data: data, isLoading: false }
            ));
    }

提取内部的输出：

(3) […]
0: Array(4) [ "abc", " 1", "aha", … ]
1: Array(4) [ "def", "2", "test", … ]
2: Array(4) [ "ghi", "3", "something", … ]
length: 6

[]
length: 0

构造函数中的输出：

(3) […]
0: Array(4) [ "abc", " 1", "aha", … ]
1: Array(4) [ "def", "2", "test", … ]
2: Array(4) [ "ghi", "3", "something", … ]
length: 6

[]
length: 0

我不明白为什么这个状态是空的。我知道promise是一个异步函数，但我认为this.setState（{data:data，isLoading:false}）会将数据设置为this.state.data，然后承诺就实现了

我在这里找到了这个解决方案，但我无法解决这个问题：

我还尝试使用一个JSON文件，因为我认为问题出在我的toCSV函数，但结果是一样的

fetchJSON() {
        fetch(`someJSONfile.json`)
            .then(response => response.json())
            .then(response => console.log(response))
            .then(data =>
                this.setState({
                    data: data,
                    isLoading: false,
                })
            )
            .catch(error => console.log(error));
    }

---

我希望你们中有人能有个主意。感谢您的时间：）

构造函数将只运行一次。使用React.Component，render（）方法将在状态更改时重新运行 检查它：

render(){
 console.log(this.state);
 return <h1>Hello World</h1>
}

render（）{
console.log（this.state）；
返回你好世界
}

您有一个额外的

。然后，

没有此数据。下面的代码应该适合您

componentDidMount() {
        this.setState({ isLoading: true });
        let dataNames;
            return fetch('url/someFile.csv')
            .then(response => this.toCSV(response))
            .then(data => {
                console.log(data)
                this.setState({ data: data, isLoading: false })
            })
    }

---

此外，console.log不在适当的位置，如果要记录内容以检查它，则应将其放置在执行setState之后。

在

componentDidMount

之前调用构造函数。您正在使用空数组初始化

数据

，并立即记录它。。。为什么您希望看到在不同的时间调用完全不同的函数中设置值？哦，这是一个简单的解决方案。这解决了我的问题。我按照Peter的建议将console.log放入渲染函数中，现在数据就在那里了。非常感谢。