FlatList не обновляется с помощью React Hooks и Realm - PullRequest
3 голосов
/ 18 апреля 2019

Я пишу пользовательский хук, чтобы использовать его с realm-js .

export default function useRealmResultsHook<T>(query, args): Array<T> {
  const [data, setData] = useState([]);

  useEffect(
    () => {
      function handleChange(newData: Array<T>) {
        // This does not update FlatList, but setData([...newData]) does
        setData(newData);
      }

      const dataQuery = args ? query(...args) : query();
      dataQuery.addListener(handleChange);
      return () => {
        dataQuery.removeAllListeners();
      };
    },
    // eslint-disable-next-line react-hooks/exhaustive-deps
    [query, ...args]
  );

  return data;
}

В моем компоненте:

const MyComponent = (props: Props) => {
  const data = useRealmResultsHook(getDataByType, [props.type]);

  return (
    <View>
      <Text>{data.length}</Text>
      <FlatList
        data={data}
        keyExtractor={keyExtractor}
        renderItem={renderItem}
      />
    </View>
  );
};

В предыдущем компонентепри выполнении setData(newData) data.length корректно обновляется внутри Text.Однако FlatList не выполняет повторную визуализацию, как и данные, не изменившиеся.

Ранее я использовал HOC и реквизит для рендеринга с тем же поведением, и он работал как ожидалось.Я делаю что-то неправильно?Я бы хотел избежать клонирования данных setData([...newData]);, потому что это может быть очень много.

Редактировать 1

Репо, чтобы воспроизвести их

https://github.com/ferrannp/realm-react-native-hooks-stackoverflow

...