React-Native: страница прокручивается вверх, когда обновление состояния происходит из сокета - PullRequest
0 голосов
/ 17 июня 2020

Я использую подключение к разъему для отображения прямой трансляции с датчиков.

У меня есть список из 10 датчиков, поэтому на странице есть прокрутка.

Когда я получаю данные в реальном времени, я объединяю их с данными своих датчиков и обновляю пользовательский интерфейс.

Я использую приведенный ниже код для объединения данных датчика с прямой трансляцией.

 // combining devices and radar data to show on UI.
  useEffect(() => {
    if (!_.isEmpty(devices)) {
      devices.forEach((item) => {
        if (data && data.serialNumber === item.serialNumber) {
          item.br = data.br;
          item.hr = data.hr;
          item.presence = data.presence;
        }
      });
    }
  }, [data]);
// [data] dependency variable changes every second and I think that;s causing the re-render each second. 

Данные поступают каждую секунду, поэтому они обновляются каждую секунду.

Моя проблема в том, что когда я начинаю прокручивать вниз, приходят новые данные и обновления состояния. и страница снова переходит в начало.

Я не уверен, возможно ли обновление состояния без повторного рендеринга? Я не уверен, что какой-либо другой API-интерфейс может помочь мне с этой проблемой.

мой scrollview со списком устройств отображается следующим образом:

 <ScrollView contentContainerStyle={{flexGrow: 1}}>
            {devices.map((item, key) => {
              const roomDetails = getRoomBackground(item);
              return (
                <TouchableOpacity .... 
</ScrollView>

Любое руководство приветствуется.

...