Ошибка при использовании useNativeDriver в React Native Animated - PullRequest
Новая
       22

Ошибка при использовании useNativeDriver в React Native Animated

0 голосов
/ 25 июня 2018

когда я использую useNativeDriver в реакции на анимацию 

state = {
    chevronUp: new Animated.Value(-50),
};

Animated.spring(this.state.chevronUp, {
    toValue: 50,
    friction: 5,
    useNativeDriver: true,  // <----- this line
}).start();

и рендер 

<Animated.View style={{bottom: this.state.chevronUp,position: "absolute", right: 20, width: 50, height: 50}}>
     <Icon name="chevron-up" size={28} color="#666"/>
</Animated.View>

эти ошибки дают мне

Свойство стиля «bottom» не поддерживается встроенным анимированным модулем

и

Невозможно вызвать setState (или forceUpdate) для неустановленного компонента. Это не работает, но это указывает на утечку памяти в вашем приложении. Для исправления отмените все подписки и асинхронные задачи в методе componentWillUnmount.

1 Ответ

0 голосов
/ 11 апреля 2019

вам нужно использовать свойство "translateY" вместо "bottom", которое поддерживается собственным драйвером, поэтому ваше начальное значение будет выглядеть следующим образом: 

state = {
    chevronUp: new Animated.Value(50),
}

Animated.spring(this.state.chevronUp, {
    toValue: -50,
    friction: 5,
    useNativeDriver: true,  // <----- this line
}).start();

и в методе рендеринга: 

<Animated.View style={{translateY: this.state.chevronUp,position: "absolute", right: 20, width: 50, height: 50}}>
     <Icon name="chevron-up" size={28} color="#666"/>
</Animated.View>
...