FlatList запускается бесконечно долго - PullRequest
0 голосов
/ 01 января 2019

Мои триггеры FlatList не достигли ожидаемого уровня.onEndReached вызывается снова и снова.Я прочитал несколько советов, чтобы обернуть плоский список в представление с flex: 1, но я все еще не работает должным образом.Также удаление прокрутки не работало -

Это не помогло https://github.com/GeekyAnts/NativeBase/issues/1736#issuecomment-401815949

<View style={baseStyles.body}>
    <View style={{flexDirection:"row", backgroundColor:theme.button.tertiary}}>
        <View style={{flex:1}}>
            <SearchBar
                onChangeText={(query) => this.setState({query})}
                placeholder='Hier suchen...' 
                showLoading
            />
        </View>
    </View>
    <View style={{flex:1}}>
        <ScrollView style={{flex: 1, flexDirection:'column'}}> 
            <View style={{flex:1}}>
                <FlatList
                data={articlesData}
                renderItem={renderFunction}
                onEndReached={this._onEndReached}
                onEndThreshold={0}
                refreshing={this.state.isLoading}
                onRefresh={this.onRefresh}
                keyExtractor={item => item.slug}
                />
            </View>
            <View style={{marginBottom:10}}>
                <Text style={{color:this.state.theme.text.primary,textAlign:"center",fontSize:16}}>Gefunden: {rowCount}</Text>
            </View>
        </ScrollView>
    </View>
</View>

1 Ответ

0 голосов
/ 13 апреля 2019

Если это загрузка или ошибка, вы можете попробовать использовать onEndReached={this.state.isLoading ? () => {} : this._onEndReached};просто пусть onEndReached ничего не делает, когда загружается состояние.Я пробовал несколько способов (debounce, await setState, используя flag), но только так работает, как и ожидалось.

<View style={baseStyles.body}>
    <View style={{flexDirection:"row", backgroundColor:theme.button.tertiary}}>
        <View style={{flex:1}}>
            <SearchBar
                onChangeText={(query) => this.setState({query})}
                placeholder='Hier suchen...' 
                showLoading
            />
        </View>
    </View>
    <View style={{flex:1}}>
        <ScrollView style={{flex: 1, flexDirection:'column'}}> 
            <View style={{flex:1}}>
                <FlatList
                data={articlesData}
                renderItem={renderFunction}
                onEndReached={this.state.isLoading ? () => {} : this._onEndReached}
                onEndThreshold={0}
                refreshing={this.state.isLoading}
                onRefresh={this.onRefresh}
                keyExtractor={item => item.slug}
                />
            </View>
            <View style={{marginBottom:10}}>
                <Text style={{color:this.state.theme.text.primary,textAlign:"center",fontSize:16}}>Gefunden: {rowCount}</Text>
            </View>
        </ScrollView>
    </View>
</View>
...