使用 Underscore debounce 获取事件对象[React]

2024-04-30

我正在尝试对我已设法做到的操作使用去抖,但是我想将 e 作为参数传递,但它不起作用。我有什么办法可以做到这一点吗?

 constructor(props, context) {
    super(props, context);
    this.testing = _.debounce(this.testing.bind(this), 2000);
}

 @action testing(e) {
     alert("debounced!!");
     //use e.target ... 
   }

如果我拿走 e 它将进入该函数,否则不会。我应该怎么做才能解决这个问题?


您可以利用事件.persist() https://facebook.github.io/react/docs/events.html#event-pooling将事件传递给 debounce 方法。

根据文件:

如果您想访问事件属性asynchronous方式,你 应该打电话event.persist()在该事件上,这将删除 从池中合成事件并允许对事件的引用 由用户代码保留。

所以你可以将该事件用作

constructor(props, context) {
    super(props, context);
    this.testing = _.debounce(this.testing.bind(this), 2000);
}

 @action testing(e) {
     alert("debounced!!");
     //use e.target ... 
   }
onChange = (e) => {
    e.persist();
    this.testing(e);
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用 Underscore debounce 获取事件对象[React] 的相关文章

  • 如何使用 Coffeescript 在 React 中渲染 HTML 标签?

    我目前正在学习 ReactJS 以及如何使用 Ruby on Rails 作为其后端 所以如果我做出愚蠢的假设 我深表歉意 请随意责骂我 我正在关注一个教程 其中作者使用 Coffeescript 而不是 ES6 来处理他的 ReactJS
  • JSX 元素类型“Element[]”不是 JSX 元素的构造函数?

    types react 16 7 17 types react dom 16 0 11 打字稿 3 2 2 function ArryElement return div 1 div div 2 div function App retur
  • 即使未显式使用“componentWillMount”,“componentWillMount”警告仍可见

    在我的代码中 我没有任何明确的用途componentWillMount 但我在运行时仍然看到一些警告webpack react dom development js 12386 警告 componentWillMount 已重命名 不建议使
  • 我点击的号码没有出现在反应项目的屏幕上

    当我尝试在屏幕中呈现点击的数字时 该数字没有出现 但它确实可以在控制台中显示 我不知道如何修复它应该在屏幕上 号码 旁边应用的号码 import render from testing library react import React
  • React JS 服务器端问题 - 找不到窗口

    你好 我正在尝试在我的reactJS项目中使用react rte 我有服务器端渲染 每次我想使用这个包时 我都会得到 return msie 6 9 b test window navigator userAgent toLowerCase
  • webpack中动态加载外部模块失败

    我正在尝试建立以下架构 一个核心 React 应用程序 它具有一些基本功能 并且能够在运行时加载其他 React 组件 这些额外的 React 组件可以按需加载 并且它们在构建核心应用程序时不可用 因此它们不能包含在核心应用程序的捆绑包中
  • 使用 Reactjs 获取滚动位置

    我使用reactjs并想要处理滚动click event 首先 我呈现了帖子列表componentDidMount 其次 通过click event在列表中的每个帖子上 它将显示帖子详细信息并滚动到顶部 因为我将帖子详细信息放在页面的顶部位
  • React 应用程序中的 addEventListener 不起作用

    一些背景 我正在尝试消费自定义网络组件在 React 应用程序中并尝试监听来自 Web 组件的事件 我相信您不能只在自定义 Web 组件上以通常的反应方式处理事件 i e
  • p5 向量减法“sub”返回错误

    我一直在尝试将 p5 草图上传到 React 构建中 使用react p5 wrapper 我能够成功在屏幕上渲染画布 但是 某些矢量函数会导致错误 var distance this position dist ball position
  • 使用 React.forwardRef 与自定义 ref prop 的价值

    我看到React forwardRef从反应文档来看 似乎是将引用传递给子功能组件的认可方式 const FancyButton React forwardRef props ref gt
  • 使用文本字段同时过滤react-table和react-leaflet标记(在表中显示过滤数据并在地图中显示标记)

    我是反应传单的新手 需要一点帮助来解决我的问题 跟进上一篇文章 https stackoverflow com questions 52557802 how to get the number of map markers per coun
  • React PropTypes 与 Flow

    PropTypes 和 Flow 涵盖相似的内容 但使用不同的方法 PropTypes 可以在运行时向您发出警告 这有助于快速找到来自服务器等的格式错误的响应 但是 Flow 似乎是未来 并且具有泛型等概念 是一个非常灵活的解决方案 Nuc
  • React Native:加载图像后应用程序性能不佳

    加载图像似乎没有问题 但是加载完毕后就出现问题了 在我的应用程序中 我在整个游戏中一张一张地加载卡片图像 一旦我加载了 40 张卡片图像 整个应用程序就会变得很慢 它总是发生在第 40 个图像处 当我在第 40 个图像之后继续加载更多卡片图
  • 需要有关 React Js 的帮助

    我是 React Js 新手 我的代码无法正常工作 请看下面 这是我的脚本文件Main jsx 该文件由 React 编译 输出放置在 dist 文件夹下的 main js 文件中 var react require react react
  • React Context 的范围是什么?

    我不清楚在哪里Context可以在 React 应用程序中创建 我可以在组件树中的任何位置创建上下文吗 如果可以 该上下文的范围是否仅限于创建它的子级 或者 Context 本质上是全局的 我可以在文档中的哪里找到这个 案例 我在页面上多次
  • React onSubmit e.preventDefault() 有时不起作用 + Axios

    现在我在 React 中面临这个奇怪的问题 其中带有 e preventDefault 的 onSubmit 函数有时会避免刷新页面 有时则不会 我创建了两个挂钩来跟踪上传的文件及其进度条 const uploadedFiles setUp
  • 将 Sweet Alert 弹出窗口添加到 React 组件中的按钮

    我为 Bootstrap 和 React 找到了这个完美的 Sweet Alert 模块 我在 Meteor 应用程序中使用它 http djorg83 github io react bootstrap sweetalert http d
  • Flux + React.js - 操作中的回调是好还是坏?

    让我解释一下我最近遇到的问题 我有 React js Flux 驱动的应用程序 有一个列表显示文章数量 注意 应用程序中有多个不同的列表 和文章详情查看在里面 但每个列表只有一个 API 端点 它返回文章数组 为了显示我需要的详细信息fin
  • 如何将React版本17降级到16?

    由于 React 17 不支持许多 React 包 如何将 React 版本从 17 降级到 16 假设您使用 npm yarn 或其他节点包管理器 依赖项版本列在package json 搜索react and react dom包下de
  • 如何修复超出最大调用堆栈大小

    有一个 MERN Firebase 应用程序并收到此错误和一堆 atdeepExtend deepCopy ts 71 RangeError Maximum call stack size exceeded getApps as apps

随机推荐