react-native - 如何在功能组件中编写Animated.Value.addListener？

Question

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

const Animated.Value= new Animated.Value(0);
Animated.Value.addListener((value)=>this.value=value;)

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

Answer 1

就我而言，我做了如下

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();
    };
  }, []): 
}