在函数内反应 Native Animated.event()

Question

我正在尝试为滚动上的某些组件设置动画，使用 const scrollY = useRef(new Animated.Value(0)).current; 用于跟踪值。

以下代码有效：

<Animated.ScrollView
  onScroll={Animated.event(
    [
      {
        nativeEvent: {
          contentOffset: {
            y: scrollY,
          },
        },
      },
    ],
    {
      useNativeDriver: false,
    }
  )}
></Animated.ScrollView>;

但是我希望能够将 onScroll 道具中的 Animated.event 函数提取到它自己的独立函数中。下面的代码似乎没有更新 scrollY：

// My onScroll handler
const handleScroll = ({ nativeEvent }) => {
  // Some other code here...

  return Animated.event(
    [
      {
        nativeEvent: {
          contentOffset: {
            y: scrollY,
          },
        },
      },
    ],
    {
      useNativeDriver: false,
    }
  );
};

// Scrollview component
<Animated.ScrollView onScroll={handleScroll}></Animated.ScrollView>;

Answer 1

不确定你是否想通了，但这会起作用：

  const handleScroll =
        scrollY && (() => {
            console.log('hey');

            return Animated.event([{ nativeEvent: { contentOffset: { y: scrollY } } }], {
                useNativeDriver: true,
            });
        }
        )();