Instantly make your desktop / hybrid apps more responsive on touch devices.
React Fastclick automatically adds fastclick touch events to elements with onClick attributes (and those that require special functionality, such as inputs) to prevent the delay that occurs on some touch devices.
Use npm to install react-fastclick
npm install react-fastclick
Now any calls to onClick or elements with special functionality, such as inputs, will have fast touch events added automatically - no need to write any additional listeners.
var initReactFastclick = ;;
- The event triggered on touch devices is a modified
touchendevent. This means that it may have some keys that are unusual for a click event.
In order to simulate a click as best as possible, this event is populated with the following keys / values. All positions are taken from the last know touch position.
// Simulate left clickbutton: 0type: 'click'// Additional key to tell the difference between// a regular click and a flastclickfastclick: true// From touch positionsclientXclientYpageXpageYscreenXscreenY
On some devices the elements flicker after being touched. This can be prevented by setting the css property
-webkit-tap-highlight-colorto transparent. Either target
html, body(to prevent the flickering on all elements) or target the specific element you don't want to flicker e.g.
React Fastclick 3.x.x has been tested with React 15, but should support older versions also.