Повторный рендеринг FlatList вызывает нежелательную навигацию, когда обновление свойства инициируется изменением useStat ⇐ Javascript

[Anonymous]

У меня есть FlatList, который принимает свойство, называемое разделами, в качестве свойства данных. Разделы вычисляются, когда useState в массиве зависимостей изменяется после того, как пользователь ввел или изменил некоторые данные в TextInput.
FlatList и разделы находятся в одном исходном файле TextInput. находится в другом, а useState — в другом. UseState импортируется в оба исходных файла, содержащие FlatList и TextInput.
Когда я печатаю в поле TextInput, он нежелательно автоматически переходит на экран с FlatList. Я заменил setBleDevices в методе setCloudID на setTestValue(id). Затем я могу ввести поле TextInput, и оно не уходит за пределы этого экрана, поэтому я почти уверен, что именно setBleDevices вызывает нежелательную навигацию.
Я пробовал использовать bleDevices [bleDevice?.id] в массиве зависимостей разделов, чтобы он срабатывал только при изменении желаемого bleDevice, а не всего состояния bleDevices. Я также попробовал обернуть метод разделов в useFocusEffect, чтобы он вычислялся только тогда, когда экран с FlatList виден пользователю, а не когда он находится на экране с полем TextInput.
const cloudID = (() => {
switch (settingsType) {
case "Temperature":
return bleDevices[bleDevice.id]?.sections?.Temperature?.cloud_id || "";
case "Humidity":
return bleDevices[bleDevice.id]?.sections?.Humidity?.cloud_id || "";
case "Panic":
return bleDevices[bleDevice.id]?.sections?.Panic?.cloud_id || "";
default:
return "";
}
})();

const setCloudID = (id) => {
setBleDevices((prevBleDevices) => {
const updatedBleDevices = { ...prevBleDevices };
updatedBleDevices[bleDevice.id] = {
...updatedBleDevices[bleDevice.id],
bleDeviceAddress: bleDevice.id,
sections: {
...updatedBleDevices[bleDevice.id]?.sections,
[settingsType]: {
...updatedBleDevices[bleDevice.id]?.sections?.[settingsType],
cloud_id: id,
}
}
};
return updatedBleDevices;
});
};

const inputsConfig = [
{
value: cloudID,
setValue: setCloudID,
placeholder: `Cloud ${settingsType} ID - e.g. 22`,
validationError: cloudIDError,
setValidationError: setCloudIDError,
validationFunction: isIDString,
errorMessage: "Please use only whole numbers 0 to 9",
keyboardType: "number-pad",
},
{
value: localID,
setValue: setLocalID,
placeholder: `Local ${settingsType} ID - e.g. 10`,
validationError: localIDError,
setValidationError: setLocalIDError,
validationFunction: isIDString,
errorMessage: "Please use only whole numbers 0 to 9",
keyboardType: "number-pad",
}
];

{inputsConfig.map((input, index) => (

(inputRefs.current[index] = el)}
returnKeyType={index < inputsConfig.length - 1 ? "next" : "done"}
onSubmitEditing={() => {
if (index < inputsConfig.length - 1) {
inputRefs.current[index + 1].focus();
} else if (canSave()) {
syncWithHub();
}
}}
value={input.value}
onChangeText={input.setValue}
placeholder={input.placeholder}
placeholderTextColor={Colors.darkGray}
keyboardType={input.keyboardType}
/>

{input.validationError}


))}
< /code>
import { useDevice } from "../../Context/DeviceContext.js";

const {
hubDevice,
bleDevice,
setBleDevices,
bleDevices
} = useDevice();

const sections = useMemo(() => {
const device = bleDevices[bleDevice?.id];
return BleSections({ device });
}, [bleDevice?.id, bleDevices]);

(

)}
keyExtractor={(item, index) => index.toString()}
contentContainerStyle={ScanStyle.content}
/>


Подробнее здесь: https://stackoverflow.com/questions/793 ... iggered-by