vue项目中fastclick的安装使用

LILEILEILOVE

已于 2022-01-19 19:17:23 修改

阅读量1.5k

点赞数 1

分类专栏： vue 文章标签： vue.js javascript typescript

于 2022-01-19 19:10:21 首次发布

本文链接：https://blog.csdn.net/lileileilove/article/details/122587764

版权

本文详细介绍了在Vue项目中如何安装并使用Fastclick库，包括在main.js中的引入，创建resetFastClick.js文件，以及针对TypeScript的支持。对于Vue3项目，还特别提到了不同的引入方式。

摘要由CSDN通过智能技术生成

fastclick 的安装

npm install fastclick --save

在main.js中引入

import FastClick from "fastclick"
//fastclick导致input框点击慢的问题,引入
import "@utils/resetFastClick.js


FastClick.attach(document.body)

在utils文件夹中创建resetFastClick.js文件

import FastClick from

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

LILEILEILOVE

关注关注

1
点赞
踩
8

收藏

觉得还不错? 一键收藏
1
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

Vue2.0 fastclick的使用

AIGC大前端小王子

08-12

4475

本文主要介绍Vue2.0 fastclick的使用，解决300ms延迟。一、安装依赖fastclick npm install fastclick 二、全局引入在main.js中 import fastClick from 'fastclick' fastClick.attach(document.body); 三、局部取消fastclick来立刻触发点击事件 <a class=...

Vue移动端开发解决300ms点击延迟—FastClick

01-20

一.FastClick 移动端设备浏览器会默认在用户点击屏幕大约延迟300ms后才会触发点击事件，这是为了检查用户是否执行的是双击事件。为了能够立即响应用户的点击事件，才有了FastClick。二.用法全局安装fastclick： npm i fastclick 也可使用淘宝镜像： cnpm i fastclick 三.Vue中引入及配置FastClick 引入： import FastClick from 'fastclick' 配置： if ('addEventListener' in document) { document.addEventListener('DOMCo

1 条评论您还未登录，请先登录后发表或查看评论

fastclick的介绍和使用

11-12

333

移动端点击延迟事件 1.移动端浏览器在派发点击事件的时候，通常会出现300ms左右的延迟 2.原因: 移动端的双击会缩放导致click判断延迟解决方式 1. 禁用缩放 `<meta name = "viewport" content="user-scalable=no" > ` 缺点: 网页无法缩放 2.更改默...

Vue引入fastclick

stphencurry的博客

07-26

249

引入fastclick解决移动的点击300毫秒延迟问题注意是移动端 npm install fastclick --save // 终端下载fastclick 在main.js中引入 import FastClick from 'fastclick' FastClick.attach(document.body);

vue 移动端 fastClick

Future1994的博客

04-15

496

vue项目引用fastclick npm指令 1 npm install fastclick -D 或者 cnpm install fastclick -D 然后在main.js写上 1 2 3 4 5 6 7 8 importFastClick from'fa...

vue 中使用fastclick

weixin_39205240的博客

07-05

3523

1. cnpm i fastclick --save2. 在main.js中引入并绑定到body import fastclick from 'fastclick';3. fastclick.attach(document.body);

vue.js添加一些触摸事件以及安装fastclick的实例

10-18

-D表示开发依赖，这样Fastclick将只在开发环境中使用，不会被打包到生产环境中，节省资源。安装完成后，你需要在项目的入口文件，通常是`main.js`中引入Fastclick，并将其绑定到页面的`body`元素上。这样做是因为...

在vue中安装使用vux的教程详解

12-10

9. 现在，你已经在 Vue 项目中成功安装并配置了 Vux。接下来，可以在 Vue 组件中引入 Vux 的组件，如： ```html 默认按钮 import { XButton } from 'vux' export default { components: { XButton...

vue.js 添加 fastclick的支持方法

10-18

在Vue.js项目中集成`fastclick`，可以显著提升移动端应用的交互性能。首先，我们需要安装`fastclick`库。在终端中运行以下命令： ```bash npm install fastclick -S ``` 这将会把`fastclick`作为项目的依赖包...

Vuecli3.x使用fastclick报错

小生鲜

12-13

986

使用vuecli3快速搭建项目模板解决移动端300ms延迟需要安装fastclick，当然如果你使用ts还需要安装@types/fastclick 在引入main.ts中是会报错 import FastClick from 'fastclick' FastClick.attach(document.body) 一般这类问题都是使用了ts才报错的，去node-modules下面找到...

vue引用fastclick

weixin_44479957的博客

03-01

447

在index.html引用 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="pragma" content="no-cache"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1

vue.js 使用 fastclick解决移动端click事件300毫秒延迟方法

qq_37899792的博客

12-19

577

一.使用npm安装： npm install fastclick -S 二.用法：安装完以后，可以在在main.js中全局引入，并绑定到body，全局生效。或者在单页面引入，只针对当前页面生效 //引入 import FastClick from 'fastclick' //初始化FastClick实例。在页面的DOM文档加载完成后 FastClick.attach(documen...

Vue用到的fastclick.js

weixin_47981445的博客

06-16

596

fastclick.js（免费下载） ; (function () { 'use strict'; /** * @preserve FastClick: polyfill to remove click delays on browsers with touch UIs. * * @codingstandard ftlabs-jsv2 * @copyright The Financial Times Limited [All Rights Reserved] * @l

Vue中引用fastclick

weixin_43398464的博客

06-13

318

在vue中引用fastclick是为了解决点击按钮延迟。首先安装fastclick：npm install fastclick --save 然后在main.js里面添加上 import FastClick from 'fastclick'

fastclick插件在Vue+ts 使用

CSDN for recording problems

02-22

455

安装一下 @types/fastclick npm i @types/fastclick 找到node-modules下面的@types/fastclick/index.d.ts文件，然后打开修改里面内容即可找到这段代码，修改下面内容 declare module "fastclick" { // function fastclick(layer: any, options?: FastClickOptions): FastClickObject; // namespace fastclick {

vue使用fastclick

wenfu814的博客

09-23

372

1.下载fastclick npm install fastclick 2.在main.js中引入 import FastClick from ‘fastclick’ if ('addEventListener' in document) { document.addEventListener('DOMContentLoaded', function() { Fast...

FastClick插件

博客

06-06

4829

处理移动端 click 事件 300 毫秒延迟，由 FT Labs 开发，Github 项目地址：https://github.com/ftlabs/fastclick 。1.为什么存在延迟？从点击屏幕上的元素到触发元素的 click 事件，移动浏览器会有大约 300 毫秒的等待时间。为什么这么设计呢？因为它想看看你是不是要进行双击（double tap）操作。2.兼容性 Mobile Safa

vue使用fastclick库解决移动端300ms点击延迟

qq_43391070的博客

07-06

286

vue使用fastclick库解决移动端300ms点击延迟当在移动端进行点击操作时，屏幕会判断用户是否进行双击之类的操作，所以会有300ms左右的延迟派发事件，针对这个问题fastclick库给出了解决方案 1.第一步安装： npm install fastclick --save 2.在main.js文件下导入fastclick库 import fastclick from 'fastclick'; 3.调用attach函数将fastclick库附加到页面体中即可 fastclick.attach(