来自 Animated.interpolate 的 React Native Reanimated 输出值

Question

我了解 Animated.Code 我在每一帧中都得到了 console.log

我想知道 Animated.interpolate 的输出当前值

代码片段

 const diffClampScrollY = Animated.diffClamp(this.props.Animation_Header_Heaght, 0, HEADER_HEIGHT)

    const headerY = Animated.interpolate(diffClampScrollY, {
        inputRange: [0, HEADER_HEIGHT],
        outputRange: [0, -HEADER_HEIGHT],
    })
render(){
   return(
    <Animated.Code>
       {() =>
         call([headerY], () => {
         console.log(headerY)
       })
    </Animated.Code>
  )
 }

我不明白来自console.log(headerY)的对象

我想知道单个当前值？

Answer 1

call(argsNodes, callback) 根据重新激活的documentation，如果 argsNodes 数组中的一个节点更新，将在 JavaScript 中调用回调，并将 argsNodes 数组中节点的当前值列表作为第一个参数。 要控制headerY 的值，您需要将其作为回调函数的参数传递以访问它，如下所示：

  ...
    <Animated.Code>
       {() =>
         call([headerY], ([headerY]) => {
         console.log(headerY)
       })
    </Animated.Code>

Answer 2

把它放在你的 Animated.Code 块中；

{() => 调试('headerY: ', headerY)}

原因是 headerY 是一个节点，因此您不能只记录它。您必须使用特制的日志节点才能记录节点值。