React Native Reanimated: Reading from `_value` directly is only possible on the UI runtime

Рейтинг: 0Ответов: 2Опубликовано: 25.03.2023

Я в своем проекте хочу использовать React Native Reanimated, что бы текст поднимался, когда на поле делается фокус. Пример кода:

const top = useSharedValue(0);
const fontSize = useSharedValue(16);

const animatedStyle = useAnimatedStyle(() => {
    return {
      top: top.value,
      fontSize: fontSize.value,
    };
  });

<Text style={[css.label, animatedStyle]}>{t(label)}</Text>

Сама форма размещена в модалке (react-native-modal). Но я получаю ошибку

Reading from `_value` directly is only possible on the UI runtime

На другом проекте я делаю точно так же и там работает. Отличие - в том проекте форма не в модалке.

Может кто сталкивался и знает как это исправить?

react-native reanimated react-native-modal
Источник: Stack Overflow на русском

Ответы

▲ 1

Решение здесь очень простое.

Вместо импортирования компонента Animated из react-native, как вы делали, видимо, до этого:

import { Animated } from 'react-native';

нужно импортировать этот компонент непосредственно из react-native-reanimated:

import Animated, { useSharedValue, useAnimatedStyle } from 'react-native-reanimated';
▲ 0

Вот моё решение:

<Animated.View style={[animatedStyle]}>
  //your view
</Animated.View>