Skip to content

FlatList data changed but refresh indicator not shows automatically #15892

@EthanChouTW

Description

@EthanChouTW

Is this a bug report?

when my flatList data changed, the layout changed but refresh indicator on top of flatList is not always shows loading automatically, I have to pull it down a little bit then the indicator stick on flatList, or it just shows at a blink when the data really changed, not shows at whole async data changed time as expected.

Have you read the Contributing Guidelines?

yes

Environment

  1. react-native -v: 0.46.0
  2. node -v: v6.9.1
  3. npm -v: 3.10.8
  4. yarn --version: 0.24.5
  • Target Platform: iOS
    android works fine

  • Development Operating System: macOS

  • Build tools: Xcode

Steps to Reproduce

  1. set refreshing state to true then call api, but refresh indicator on flatList not always automatically pull down
  2. api back then data changed, it pull down at a blink, set refreshing state to false

Expected Behavior

loading indicator should show right after api called.

Actual Behavior

it shows and disappear quickly on data changed.

 onRefresh = async () => {
    this.setState({
      isRefreshing: true
    });
    await this.props.searchProducts(this.state.searchString);
    await this.setState({
      data: this.props.products.searchProductsIds.map(
        id => this.props.products.searchProductsById[id]
      )
    });
   
    this.setState({
      isRefreshing: false
    });
   
  };

  <FlatList
      removeClippedSubviews={false}
      onRefresh={this.onRefresh}
      refreshing={this.state.refreshing}
      extraData={this.extraData}
      data={this.state.data}
      renderItem={this.renderItem}
      keyExtractor={product => product.id}
      contentContainerStyle={styles.listContainer}
      onEndReached={this.handleLoadMore}
      onEndReachedThreshold={5}
    />

Metadata

Metadata

Assignees

No one assigned

    Labels

    Ran CommandsOne of our bots successfully processed a command.StaleThere has been a lack of activity on this issue and it may be closed soon.

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions