问题标签 [panresponder]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
26 浏览

react-native - 如何知道 react native 的每个组件的屏幕空闲?

我在网上找到了例子:

https://snack.expo.io/Sy8ulr8B-

主要概念是在每个组件中应用此代码:

0 投票
0 回答
38 浏览

reactjs - PanResponder 正在为类组件中的其他组件工作

我需要让一个部分只能左右滑动。我的类组件中有 3 个视图。 在此处输入图像描述

在上图中,我将 PanResponder 应用于红色框,但效果发生在 UI 的整个绿色部分。

上面的代码用于红色框。我只是在另一个组件类中呈现这个 UI。

我的要求是让红框项目可以左右滑动。

帮助将不胜感激。

0 投票
0 回答
27 浏览

react-native - 如何在 panResponder 的发布事件中设置状态?

在类组件内部,我有一个panResponder并且在onPanResponderRelease事件期间,我想更新类组件的状态。但是,在调用 setState 后,状态永远不会更新。

为什么 setState 不起作用?如果我在另一个事件中使用 setState,比如onPanResponderMove,它似乎确实有效,这对我来说很奇怪。

0 投票
0 回答
19 浏览

javascript - 如何在 PanResponder 中停止手势

我正在与一个使用 Stepper 组件来控制结帐过程页面的客户合作。流程是购物车 --> 结帐 --> 确认付款 --> 订单摘要。每个页面都有一个带有数字索引的“步骤”,从 0 到 3。在 Checkout 组件中,有一个 CheckoutLayout 组件包装其他屏幕并控制 handleSubmit 和后退按钮功能。后退按钮本身可以正常工作,但我在结帐布局中添加了一个 panResponder,它在向左滑动时触发回调。出于某种原因,滑动触发了重新渲染,它将活动步骤重置为 0(单击自定义后退按钮时不会发生这种情况)。一旦在 panResponder 中触发回调,有谁知道如何在用户滑动时停止手势?

结帐组件:

CheckoutLayout 组件:

UseSwipeCallback 钩子:

0 投票
0 回答
5 浏览

react-native - 如何使用 Animated.event 阻止可拖动对象越界

我有以下动画事件

有没有办法设置一个条件,如果结果 pan.x + width 没有超出父视图的范围,则仅将 dx 添加到 pan.x 中?

例如这样的事情:

我对实际代码不感兴趣只是想知道是否有办法设置条件以防止动画事件映射值?