Search code examples
javascriptreactjsreact-nativereact-proptypesreact-animated

PropTypes for Animated.Value?


I've defined Animated Value at parent as below

const scrollY = new Animated.Value(0);

console.log(scrollY); // 0;
console.log(typeof scrollY); // object;

Then I need to pass this value to my component as below

<ChildComponent animatedValue={scrollY} />

Now I'm wondering, at ChildComponent, what should be the correct proptype for my props animatedValue?

ChildComponent.propTypes = {
  animatedValue: PropTypes.number.isRequired
};

If I define as PropTypes.number I get warning which make sense because typeof scrollY is object.

But we can't define below due to eslint error, for object we should be using PropTypes.shape, but I have no idea what shape should I set?

ChildComponent.propTypes = {
  animatedValue: PropTypes.object.isRequired // eslint error
};

Solution

  • You can check that the passed object is an instance of a class

    PropTypes.instanceOf(Animated.Value)