npm install react-with-gesture
Wraps a component into a div that receives MouseDown and TouchStart events, then captures movement until release.
Demo: https://codesandbox.io/embed/jzn14k0ppy
down, true on mouse-down or finger-touchx/y, screen coordinatesxDelta/yDelta, coordinates relative to initial coordinates, great for sliding/dragging gesturesxInitial/yInitial, coordinates of the first click/touch
import { withGesture } from 'react-with-gesture'
@withGesture
class Something extends React.Component {
render() {
const { down, x, y, xDelta, yDelta, xInitial, yInitial } = this.props
return <div>Drag me! coordinates: {x}, {y}</div>
}
}or ...
withGesture(
({ down, x, y, xDelta, yDelta, xInitial, yInitial }) =>
<div>Drag me! coordinates: {x}, {y}</div>
)or ...
import { Gesture } from 'react-with-gesture'
class Something extends React.Component {
render() {
return (
<Gesture>
{({ down, x, y, xDelta, yDelta, xInitial, yInitial }) =>
<div>Drag me! coordinates: {x}, {y}</div>
}
</Gesture>
)
}
}
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent