web-dev-qa-db-fra.com

Impossible d'ajouter la propriété _tracking, l'objet n'est pas extensible

CAS D'UTILISATION

J'ai une liste de cartes et j'essaie de créer une fonctionnalité de style de l'amadoueur gauche/droite. J'ai obtenu le glissement pour travailler avec panResponder, mais je rencontre des problèmes pour animer le backgroundColor

CONFIGURATION 

constructor() {
  super();

  this.state = {
    bgColor: new Animated.Value(0),
  };
}

onPanResponderMove: (evt, gestureState) => {
  Animated.timing(this.state.bgColor, {
              toValue: 1,
              duration: 100,
            }).start();
}

render() {
    const s = this.state;
    const p = this.props;

    const bgColor = s.bgColor.interpolate({
       inputRange: [0, 1],
       outputRange: [colors.gray.one, colors.primary.light]
    })

    return(
      <View style={ [styles.wrapper, pushLeft(s.dx)] }>
        <View {...this._panResponder.panHandlers} style={ styles.content } onLayout={ this.onLayout }>
          { this.props.children }
          <View style={ [styles.overlay, { backgroundColor: bgColor } ]}/>
        </View>
      </View>
    )
  }

erreur [~ # ~] [~ # ~]

Dès que je commence à faire glisser la carte, je reçois

"Impossible d'ajouter la propriété _tracking, l'objet n'est pas extensible"

NOTES SUPPLÉMENTAIRES

Si je remplace l'affectation d'interpolation par bgColor par le code ci-dessous, je n'obtiens pas l'erreur, mais évidemment je perds l'animation de la couleur.

const bgColor = s.bgColor._value === 0 ? colors.gray.one : colors.primary.light;

QUESTION

Et des idées sur pourquoi l'erreur est lancée et comment la résoudre?

javascriptanimationreact-native
20
ken4z

Pour utiliser Animated, vous avez besoin d'un composant spécial "animeable" (soit Animated.View, Animated.Text Ou Animated.Image, Qui sont intégrés, ou créez-en un nouveau à l'aide de la fonction Animated.createAnimatedComponent()). Serait-ce votre problème?

49
anonymous