javascript - 在 React Native 上获取请求后无法设置状态

Question

在使用 fetch 或 axios (不适用于两者)执行 GET 请求后尝试更改状态对象的值时，我遇到了一个奇怪的问题。我的代码非常基本，我尝试了很多在网上找到的解决方案，但没有一个有效。

这是我到目前为止的代码...

class FilterScreen extends React.Component {

    state = {
        selectedCity: null,
        cities: [],
        selectedSpecialty: null,
        specialties: [],
    };


    componentWillMount() {
        this.fetchCities();
    }

    fetchCities = () => {

        fetch(`http://127.0.0.1:8000/app/cities`)
            .then(res => res.json())
            .then(e => {
                this.setState({
                    results: e.data.map(item => ({
                        label: item.name,
                        value: item.id
                    }))
                });
            })
            .catch(
                () => (
                    alert('There was an issue while fetching the doctors.')
                )
                );
        };

    render() {
        return (
          ... the body of the component...
            )}
}

export default FilterScreen;

我真的不明白我在这里做错了什么。我对 React Native 还很陌生，也许这与生命周期有关，但我确信 componentWillMount 是正确的方法。也许我错了 ...如有任何帮助，我们将不胜感激:D

Answer 1

您应该在 componentDidMount 中进行异步调用。请参阅this 。