使用kriasoft/react-starter-kit创建 Web 应用程序。它从我的 api 服务器获取对象,并在页面上显示它们。应用程序在获取数据时应显示加载图标。
我的代码在获取对象后不会重新渲染组件。它继续显示“正在加载...”,即使我想看到“数据已加载!”。
import React from 'react';
import fetch from 'isomorphic-fetch'
class Search extends React.Component {
constructor(...args) {
super(...args);
this.getObjectsFromApiAsync = this.getObjectsFromApiAsync.bind(this);
this.state = {
isLoading: true,
};
}
async getObjectsFromApiAsync() {
try {
const response = await fetch('http://localhost:3030/api');
const content = await response.json();
// console.log(content)
this.setState({isLoading: false});
} catch(e) {
console.error(e);
}
}
componentWillMount() {
this.getObjectsFromApiAsync();
};
render() {
if (this.state.isLoading) {
return (
<p>Loading...</p>
);
}
return (
<p>Data loaded!!</p>
);
}
}