Search code examples
react-nativereact-reduxreact-native-flatlist

React native FlatList not rerendering when data prop changes to empty array


I have a FlatList with a data prop pulling from Redux

  render() {
    return (
      <View>
        <FlatList
          data={this.props.arrayOfPlacesFromRedux}
          renderItem={({item}) => {.......

Whenever I dispatch changes to arrayOfPlacesFromRedux(i.e. adding or removing children), the FlatList rerenders....UNLESS I remove all children from array (i.e. make length zero).
When arrayOfPlacesFromRedux changes from a positive length to a length of zero, the FlatList does not rerender.....however all other types of changes to array do indeed cause FlatList to rerender

UPDATE 02/27 Below is my reducer used to update Redux arrayOfPlacesFromRedux

const reducer = (state = initialState, action) => {
  switch (action.type) {
    case UPDATE_PLACES_ARRAY:
      return {...state, arrayOfPlaces: action.payload};
    default:
      return state;
  }
};

In the situation noted above when FlatList does not rerender.....action.payload is an empty array


Solution

  • Oh no rookie mistake that wasted everyones time!! I was implementing shouldComponentUpdate method that was stopping Flatlist rendering :( Thanks for all for the answers