CODEWITHSUNDEEP
react-nativescrollreact-animated
Lukas Köhl
Lukas Köhl

Reputation: 1579

Animated.event does not change state

In react-native I am using the Swiper module found here:

<Swiper
      bounces={true}
      loop={false}
      showsPagination={false}
      onScroll={this.handleScroll}
      scrollEventThrottle={1}
    >...

Then outside the render method, I defined handleScroll like this:

handleScroll = Animated.event(
  [{ nativeEvent: { contentOffset: { x: this.state.left } } }],
  {
    listener: event => {
      console.log(this.state.left);
    }
  });

When performing the scroll on Swiper and looking on the output nothing changes.

I am aware to put the Animated.event directly into onScroll and it works like this, but I am very curious why it doesn't work

Upvotes: 0

Views: 498

Answers (1)

Adnan sayed
Adnan sayed

Reputation: 194

Animated.event() returns a function handler you need to call that function. Try this.

handleScroll = (event) => Animated.event(
  [{ nativeEvent: { contentOffset: { x: this.state.left } } }],
  {
    listener: event => {
      console.log(this.state.left);
    }
  })(event);

Upvotes: 0

Related Questions