如何在功能组件中编写Animated.Value.addListener?

roz*_*333 4 animation react-native

我知道在类组件中我们以这种方式使用 addListener :

const Animated.Value= new Animated.Value(0);
Animated.Value.addListener((value)=>this.value=value;)
Run Code Online (Sandbox Code Playgroud)

我想知道如何在功能组件中转换 Animated.Value.addListener?第二个问题:我应该将 addListener 放在 useEffect 挂钩中吗?

Saa*_*mar 5

就我而言,我做了如下

import React, { useRef, useEffect } from "react";

const AnimationBox = (props) => {
  const pan: any = useRef(new Animated.ValueXY(props.pan)).current;

  useEffect(() => {
    pan.addListener((value) => {
      console.log(value);
    });

    return () => {
      pan.removeAllListeners();
    };
  }, []): 
}
Run Code Online (Sandbox Code Playgroud)