React Native 手势触摸事件机制详解（基础篇）

     

欢迎大家关注【跨平台开发那些事】公众号，定期推送跨平台开发技术实践。

       源码已开源到Github，详细代码可以查看：《React Native 触摸事件代码实践》。

       博客产出拖延了很久，老早定的主题现在才开始写。之前群里朋友对于React Native（以下简称RN）中手势触摸相关问题提出的频率很高，并且在实际开发过程中较难理解和处理。本篇内容将围绕触摸事件相关问题一探究竟，也作为记录供后期参考。

       作为与用户交互的第一层，触摸事件直接影响着用户行为体验。在Android 和 iOS 平台设备中，对于触摸机制做了非常完善的封装，能够很方便的帮助开发者处理基本的触摸行为操作，原生平台通过注册Listener的方式可以轻松的实现单击，双击等操作。在RN中同样提供了与Native触摸事件映射一致的处理方式，方便React Native开发者处理触摸行为，定义触摸操作。

一、RN系统触摸组件

RN中实现按钮单击组件的方式很简单，系统为我们提供了四种方式：

（1）TouchableOpacity

（2）TouchableHightLight

（3）TouchableNativeFe