Я использую подключение к разъему для отображения прямой трансляции с датчиков.
У меня есть список из 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>
Любое руководство приветствуется.