Can I Fastclick ReactJS running in Cordova

Question

Does fastclick work with ReactJS's event system? It doesn't seem to be taking when run through Cordova onto iOS or Android. If not, is there another way of getting the same results. My app has no double-tap functionality so I'd like to remove that delay across the board, if possible...

Answer 1

Edit

Facebook decided to not add support for defining custom event types and recommend you to use something like react-tappable so you can write something like <Tappable onTap={}>.

---

Facebook's working on a solution in the form of TapEventPlugin, but it won't be made available until they make some decisions.

If you're reading this you're probably working on a project that can't wait until they figure out how they want to publish it.

This repo is for you: https://github.com/zilverline/react-tap-event-plugin

When Facebook solves #436 and #1170, this repo will disappear.

This solution works for React 0.14.x and 15.x.

npm i -S react-tap-event-plugin 

Example of usage:

var React = require("react"); var ReactDOM = require("react-dom"); injectTapEventPlugin = require("react-tap-event-plugin"); injectTapEventPlugin();  var Main = React.createClass({   render: function() {     return (       <a         href="#"         onTouchTap={this.handleTouchTap}         onClick={this.handleClick}>         Tap Me       </a>     );   },    handleClick: function(e) {     console.log("click", e);   },    handleTouchTap: function(e) {     console.log("touchTap", e);   } });  ReactDOM.render(<Main />, document.getElementById("container")); 

Note that with the injector, you will probably need to use only onTouchTap (and not onClick anymore).

Answer 2

I got FastClick to work with React, in a Webpack project. A few things seem finicky but it mostly works. (Update: only a toggle switch that was simulating clicks on a hidden checkbox was finicky -- that would be a problem regardless of React). Here's how I turned it on:

npm install -S fastclick

In main.jsx:

import FastClick from 'fastclick';  window.addEventListener('load', () => {   FastClick.attach(document.body); }); 

So even if you're not using Webpack or Browserify, I'm guessing as long as you can run the load event listener, you'll be fine.