RN-Flatlist元件，更新資料，資料顯示錯亂

1.需求

從背景擷取的資料清單，在Flatlist元件顯示，本地根據名稱對每一個Item進行模糊查詢，資料查詢列印出來的是對的，但是元件上顯示錯誤，

2.原因

可能是由，Flatlist元件渲染機制導緻，props在全等比較中沒有變化，是以元件不會更新資料

3.解決

在元件屬性中加上：extraData={this.state}

<FlatList
     extraData={this.state}
      data={deviceAreaList}
      numColumns={2}
      keyExtractor={(item, index) => `${item.areaId}`}
      renderItem={({ item }) => this.renderCell(item)}
      ListEmptyComponent={this.ListEmptyComponent(deviceNum, isSearchArea)}
      refreshing={refreshing}
      onEndReachedThreshold={0.1}
      showsVerticalScrollIndicator={false}
      refreshControl={
               <RefreshControl
                  refreshing={refreshing}
                  colors={['#ff0000', '#00ff00', '#0000ff']}
                  progressBackgroundColor={"#ffffff"}
                  onRefresh={() => this.onRefreshAction()}
           />
          }
   />