React native 监听所有事件

Question

我正在我的应用程序中创建空闲计时器，我想在每次单击、滚动等时重置计时器。在每个 onPress 事件上调用我的 resetTimer() 函数似乎是无稽之谈。在网络中，我会做事件监听器，如：$(document).mousemove()、$(document).mousedown()、$(document).scroll() 等

关于在 React native 中有一些顶级事件监听器可以调用 resetTimer() 任何触摸事件的建议吗？

Answer 1

我认为没有官方的 API。

作为调查我们如何使用 Cycle.js with React Native, we did experiment on monkey patching the __fbBatchedBridge global defined by the BatchedBridge 模块来监听来自本机端的所有全局事件的一部分。

它不适合我们，因为我们得到的都是原始触摸事件，并且无法过滤不同种类的事件类型。但是，如果您确实想要知道何时发生任何触摸事件，那么该解决方案可能适合您。

当然，它会很脆弱和笨拙:)

Answer 2

经过一天的调查 rect-native 代码后，我发现 fbjs 包含 TouchEventUtils（facebook 在他们的 react native 测试中使用它），它允许使用不同的触摸事件状态函数（onTouchMove(event)、onTouchStart(event)、onTouchEnd(event)）。

所以我做了什么：

npm install fbjs --save

并简单地将 onTouchStart 添加到包装我的路由的顶级根组件，因此我覆盖了所有屏幕，因为我在所有 screens/views 包装器上使用它。

所以我的代码看起来像这样：

/* rest of my imports */
import TouchEventUtils from 'fbjs/lib/TouchEventUtils';

class Root extends Component {

    onTouchStart(){
        //my code to properly reset session timer
    }

    render() {
        return (
            <View
                onTouchStart={this.onTouchStart}
            >
                {/*My routes*/}
            </View>
        )
    }
}

就是这样，这就是访问顶级事件侦听器并对每个事件执行某些操作的解决方案。我没有深入挖掘（因为这对我的情况来说已经足够了），所以我不确定它得到了什么对象以及它是否可以帮助识别任何进一步的属性（即记录点击的元素）。

React native 监听所有事件

React native listen to all events

javascript

mobile

event-listener

react-native