React-nativeanimate.event 自定义 onScroll 监听器

2024-05-27

在官方的react-native文档中有一个关于Animated.event方法。例如,他们使用以下代码:

onScroll={Animated.event(
   // scrollX = e.nativeEvent.contentOffset.x
   [{ nativeEvent: {
        contentOffset: {
          x: scrollX
        }
      }
    }]
 )}

我想将正确的值映射到Animated.event方法,我还想将 onScroll 回调参数映射到我自己的回调。基本上我想做这样的事情:

onScroll={(event) => {
  myOwnCallback(event.nativeEvent.contentOffset.x)
  Animated.event(
    // scrollX = e.nativeEvent.contentOffset.x
    [{nativeEvent: {
        contentOffset: {
          x: scrollX
        }
      }
    }]
  )
}}

您能解释一下如何做到这一点吗?


当你查看源代码时:

/**
   * Takes an array of mappings and extracts values from each arg accordingly,
   * then calls `setValue` on the mapped outputs.  e.g.
   *
   *```javascript
   *  onScroll={Animated.event(
   *    [{nativeEvent: {contentOffset: {x: this._scrollX}}}]
   *    {listener},          // Optional async listener
   *  )
   *  ...
   *  onPanResponderMove: Animated.event([
   *    null,                // raw event arg ignored
   *    {dx: this._panX},    // gestureState arg
   *  ]),
   *```
   *
   * Config is an object that may have the following options:
   *
   *   - `listener`: Optional async listener.
   *   - `useNativeDriver`: Uses the native driver when true. Default false.
   */
  event,

这就是我让它发挥作用的方式:

onScroll={Animated.event(
            [{ nativeEvent: { contentOffset: { y: this.state.scrollY } } }],
  {
    useNativeDriver: true,
    listener: event => {
      const offsetY = event.nativeEvent.contentOffset.y
      // do something special
    },
  },
)}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

React-nativeanimate.event 自定义 onScroll 监听器 的相关文章

随机推荐

  • 在 ASP.NET Core 中使用防伪功能并出现错误 - 防伪令牌无法解密

    我的 ASP Net Core MVC 应用程序已添加防伪中间件如下 启动 cs services AddMvc services AddSession services AddCaching services AddSession o g
  • 使用带有通配符的 jquery grep 搜索对象数组

    我正在使用 jquery grep 搜索对象数组 并希望在搜索中包含通配符 例如 我有一个数组如下 courses code ENCH3TH otherFields otherStuff code ENCH3THHS1 otherField
  • SwiftUI 从一个列表拖动到另一个列表

    我正在尝试在列表之间拖放 我尝试过的 我找到了一个在 UIKIt 中执行此操作并使用 UIViewControllerRepresentable 的解决方案 但这不是我想要的 另一个解决方案是在列表上使用 onDrag 但这在 iPad 上
  • 对 id 属性使用自定义类型

    我有以下课程 public class UserId public UserId int id some validation public override string ToString public class User public
  • 对齐 emacs lisp 中的正则表达式

    我正在尝试使用以下 elisp 函数来对齐文本 defun align Align lines by interactive align regexp region beginning region end 我正在尝试对齐以下文本 offe
  • 有没有办法确定 Firebug 或 Web Inspector 中发出 XHR 的行?

    有没有办法确定 Firebug 或 Web Inspector 可能是 Opera Dragonfly IE 开发人员工具栏 中发出 XHR 的行和文件名 如果没有 找出答案的最佳方法是什么 只是在代码库中搜索调用的 URI 不过 通常它会
  • 获取路由查询参数

    我正在尝试从 rc1 迁移到 rc4 但在获取查询字符串参数时遇到问题 ActivatedRoute 对象始终为空 英雄组件 ts import Component OnInit from angular core import Contr
  • 使用 boto3 和 ftplib 将文件从 FTP 复制到 S3 存储桶失败,并显示“500 语法错误,命令无法识别”

    我需要将数据从 FTP 服务器发送到 S3 存储桶 而不将文件保存到本地驱动器 在互联网上 我发现我们可以使用io BytesIO 作为缓冲区 但我的代码失败了 error perm 500 语法错误 命令无法识别 剧本 ftp ftpli
  • 在 UWP 中拖放到银行帐户列表中

    我有一个本地银行的通用 Windows 应用程序 我正在处理汇款视图 他们需要使用 UWP 应用程序中的拖放功能将资金从一个帐户转移到另一个帐户 我已经制作了动画部分 但在将列表项拖放到 帐户至 列表后需要帮助 I ll attach a
  • 查找关联数组中最小值的键

    在 PHP 中 假设您有一个如下所示的关联数组 pets array cats gt 1 dogs gt 2 fish gt 3 我如何找到具有最低值的密钥 在这里 我要寻找cats 是否有一些我错过的内置 PHP 函数可以实现此目的 如果
  • 帧缓冲区/颜色缓冲区?

    有人可以指出我两者是否相同吗 我的意思是我一直在阅读有关它的信息 这里的红皮书说 颜色缓冲区本身可以由多个子缓冲区组成 系统上的帧缓冲区包含所有这些缓冲区 here http glprogramming com red chapter10
  • 打印从 1 到 100 的质数

    此 C 代码打印出以下素数 3 5 7 11 13 17 19 23 29 31 37 41 43 47 53 59 61 67 71 73 79 83 89 97 但我不认为这就是我的书所希望的写作方式 它提到了一些关于数字的平方根的内容
  • 对象数组的 JSON 模式定义

    我见过这个其他问题 https stackoverflow com q 10809459 940217但它并不完全相同 我觉得我的问题更简单 但就是不起作用 我的数据如下所示 loc a value 1 toll null message
  • 检测 Web MIDI API 中是否连接了 MIDI 接口

    我正在 Chrome OS X 中试验 Web Midi API 到目前为止 我得到了很好的结果 但我想知道 有没有办法在应用程序运行时检测 MIDI 接口是否连接 断开 目前的工作方式是重新启动浏览器 让应用程序知道界面是否存在 似乎有一
  • C++ 是否允许函数的默认返回类型?

    在 C 语言中 以下恐怖行为是有效的 myFunc return 42 return type defaults to int 但是 在 C 中呢 我无论如何都找不到它的参考 我的编译器 Codegear C Builder 2007 目前
  • Android SyncAdapter 回调

    我已经按照 SDK 中的 SimpleSyncAdapter 示例项目的思路实现了 SyncAdapter AccountManager 和私有 ContentProvider 一切都运转良好 现在 当从远程服务器下载了设置了特定标志的新行
  • Python dateutil 解析器失败

    我正在尝试解析从电子邮件标头获取的以下日期字符串 from dateutil import parser d1 parser parse Tue 28 Jun 2011 01 46 52 0200 d2 parser parse Mon 1
  • R:data.table 与 merge(aggregate()) 性能

    或者更一般地说 它是DT SD by versus merge aggregate 话不多说 这里是数据和示例 set seed 5141 size 1e6 df lt data table a rnorm size b paste0 sa
  • 在 MAC OSX 上使用 CMake 生成 .bundle 文件

    我想生成一个可执行文件 bundle文件于Mac OSX 10 6 8 using CMake 我的 CMakeLists txt 文件如下所示 cmake minimum required VERSION 2 8 PROJECT TEST
  • React-nativeanimate.event 自定义 onScroll 监听器

    在官方的react native文档中有一个关于Animated event方法 例如 他们使用以下代码 onScroll Animated event scrollX e nativeEvent contentOffset x nativ