Home > Software engineering >  How do I solve React native Animate Type Error Props
How do I solve React native Animate Type Error Props

Time:01-09

Argument of type '{ toValue: number; duration: number; useNativeDriver: true; }' is not assignable to parameter of type 'SpringAnimationConfig'. Object literal may only specify known properties, and 'duration' does not exist in type 'SpringAnimationConfig'.

Argument of type '{ toValue: number; duration: number; useNativeDriver: true; }' is not assignable to parameter of type 'SpringAnimationConfig'. Object literal may only specify known properties, and 'duration' does not exist in type 'SpringAnimationConfig'.

CodePudding user response:

You're trying to use a timing config on a spring animation. Spring animations have a different configuration because they are based on physics and not set duration. Check the docs to see what props are supported in withSpring's config.

CodePudding user response:

The SpringAnimationConfig type is defined in the react-native library as:

type SpringAnimationConfig = {
  bounciness?: number;
  speed?: number;
  tension?: number;
  friction?: number;
  stiffness?: number;
  mass?: number;
  overshootClamping?: boolean;
  restDisplacementThreshold?: number;
  restSpeedThreshold?: number;
  useNativeDriver?: boolean;
};

As you can see, the duration attribute is missing from the SpringAnimationConfig type. Instead, it has a number of settings like bounciness, speed, tension, and friction that may be used to alter how the spring animation behaves.

Remove the duration property from the object literal and replace it with the relevant values from the SpringAnimationConfig type to configure the spring animation in order to resolve the problem.

  • Related