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

时间:2018-07-30 12:22:47

标签: javascript reactjs react-native

在使用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

1 个答案:

答案 0 :(得分:1)

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