fly63前端网

www.fly63.com

首页文章资源工具教程 栏目
  • 关于我们
  • 网站投稿
  • 赞助一下
搜索

在线工具_工作生活好帮手

打造各种简单、易用、便捷的在线工具,网友无需注册和下载安装即可使用

点击查看

关闭

提交网站

react-use-gesture
分享
复制链接
新浪微博
QQ 好友

扫一扫分享

GitHub:https://github.com/react-spring/react-use-gesture
网站描述:组件绑定鼠标/触摸手势的小助手

react-use-gesture是一个钩子,可以将更丰富的鼠标和触摸事件绑定到任何组件或视图。使用您收到的数据,设置手势变得微不足道,并且通常只需要几行代码。  


简单的例子

示例使div拖拽成为可拖动,以便在拖动时跟随鼠标,并在发布时返回其初始位置。

import { useSpring, animated } from 'react-spring'
import { useDrag } from 'react-use-gesture'

function PullRelease() {
  const [{ xy }, set] = useSpring(() => ({ xy: [0, 0] }))

  // 1. Define the gesture
  const bind = useDrag(({ down, delta }) => set({ xy: down ? delta : [0, 0] }))

  return (
    <animated.div
      // 2. Bind it to a component
      {...bind()}
      style={{ transform: xy.interpolate((x, y) => `translate3D(${x}px, ${y}px, 0)`) }} />


链接: https://fly63.com/nav/2619

more>>
相关栏目
uni-app
使用 Vue.js开发跨平台应用的前端框架
官网GitHub
Flutter
谷歌推出的跨平台移动UI框架
官网GitHub
framework7
用于开发接近原生iOS或Android系统外观和体验的 hybrid mobile apps 或 web apps
官网GitHub
ionic
ionic是一个用来开发混合手机应用的,开源的,免费的代码库
官网GitHub
weex
阿里推出的Native框架,支持iOS、安卓、YunOS及Web等多端部署
官网GitHub
Taro
多端统一开发框架,生成能运行在微信小程序、H5、React Native 等的应用
官网GitHub
React Belle
一个React组件库
官网GitHub
noUiSlider
一个轻量级的Js范围滑块库
官网GitHub
mavonEditor
基于vue的markdown编辑器
点击进入GitHub
fair ui
为Flutter设计的动态化框架
官网GitHub
react-native-ui-lib
React Native的UI组件库和工具集
官网GitHub
react-native-sideswipe
简单跨平台的React Native可滑动的组件
点击进入GitHub
weui+
在weui和zepto基础上开发的增强UI组件
官网GitHub
weui
微信官方设计团队为微信内网页和微信小程序量身设计的的基础样式库
官网GitHub
ThorUI
轻量、简洁的移动端组件库
官网GitHub
MUI
最接近原生APP体验的高性能前端框架
官网GitHub

手机预览