Возвращаем переменную из интерполированной функции в React Native - PullRequest
Новая
       8

Возвращаем переменную из интерполированной функции в React Native

0 голосов
/ 18 марта 2020

Есть ли способ вернуть значения в реагировать нативно из интерполяции. Вместо запуска дополнительного состояния через приложение я хочу использовать существующее интерполированное значение, а затем возвращать значение true или false в зависимости от его текущего значения.

Однако анимированное значение не является действительным числом, которое может храниться вне родной драйвер (насколько я вижу), и, очевидно, вы не можете сделать следующее, но вот то, чего я по сути пытаюсь достичь. 

var Active = this.props.status.interpolate({
    inputRange: [-1, 0, 1],
    outputRange: [false, true, false],
});

1 Ответ

1 голос
/ 19 марта 2020

Важно помнить, что подобный вам код запускается только один раз при каждом рендере. По сути, это объявление для интерполяции 

 const backgroundColor = position.interpolate({
   inputRange: [0, 100],
   outputRange: ['red', 'blue'],
  });

 //

 <View style={{ backgroundColor }} />

Если, скажем, ваш рендер вызывается один раз, это не мешает вашему представлению изменить цвет фона в будущем в ответ на изменение анимированного значения, даже если это рендер никогда больше не будет вызываться. Так поможет ли вам узнать ценность этой анимации всего один раз? Даже если бы вы могли получить его таким образом, вы не получите обновленное значение в следующий раз, когда оно изменится (если только ваш рендеринг не запущен по какой-то другой не связанной причине). Значение не является реактивным и почти всегда будет бесполезным для целей рендеринга.

Правильный способ сделать это - подключить слушателя к анимированному значению 

componentDidMount() {
  this.props.status.interpolate.addListener(({ value }) => {
    console.log('new value: ', value)
    this.lastKnownValue = value
  })
}

. Это будет уведомлять вас каждый раз. значение меняется. Если вы все еще хотите получить доступ к этому значению при рендеринге, просто сохраните его где-нибудь (в свойстве класса компонента на основе класса или в ref-контейнере функционального компонента) и прочитайте его оттуда во время рендеринга

...