flatlist endReached触发自身而不在React Native中滚动

时间:2018-04-19 21:53:33

标签: javascript react-native react-native-android

我使用Flatlist来显示来自api的一些数据但是出于某种原因我可以看到当加载屏幕时自动触发事件我可以看到所有请求都在同时进行,而我没有滚动列表!

代码:

    this.state = {
        isLoading: false,
        categories: [],
        page: 1,
    };

    componentDidMount() {
        this.fetchCategories();
    }

    fetchCategories() {
        this.setState({isLoading: true});
        categoryApi.getOne(this.state.page).then(response => {
            if (response.data) {
                this.setState({
                    categories: this.state.categories.concat(response.data.data),
                    isLoading: false,
                });
            } else {
                this.setState({isLoading: false});
                Alert.alert(
                    'Something wrong happened!',
                    'My Alert Msg',
                    [],
                    {cancelable: true}
                )
            }
        });
    }

    componentWillMount() {

    }

    showMore = () => {
        // console.log("End reached.");
        this.setState({page: this.state.page + 1});
        this.fetchCategories();
    };





 <FlatList
                        data={this.state.categories}
                        extraData={this.state}
                        renderItem={(rowData) => <CategoryItem navigate={navigate} item={rowData}/>}
                        onEndReached={this.showMore}
                        keyExtractor={(item, index) => index}
                    />

当page = 1时,我的第一个电话会议中的数据集似乎也有重复数据。

0 个答案:

没有答案