解决betterScroll在vue中存在图片时,出现拉不动的问题


Posted in Javascript onSeptember 27, 2018

1.先写一个图片加载的方法

class ImgLoadClass {
 static preloadImages = (arr) => {
 //已经加载完的图片数量
 let loadeImage = 0
 //存放图片的数组
 let newImages = []
 //处理存入字符串,取得src部分
 //let arr = str.match(/src="(.+)"\s{1}/g)
 
 //返回一个promise对像
 return new Promise((resolve,reject)=>{
  for (let i=0;i < arr.length;i++){
  for(let i = 0; i < arr.length; i++){
   newImages[i] = new Image()
   //设置图片src属性
   //newImages[i].src = arr[i].slice(5,-2)
   newImages[i].src = arr[i]
   //图片绑定onload事件,确保加载完成
   newImages[i].onload = ()=>{
   loadeImage++
   //当全部加载完成后,resove
   if(loadeImage === arr.length){
    resolve()
   }
   }
   newImages[i].onerror = ()=> {
   reject()
   }
  }
  }
 })
 }
 
}

2.引用该方法,调用成功后再初始化betterScroll

以上这篇解决betterScroll在vue中存在图片时,出现拉不动的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript 建设银行登陆键盘
Jun 10 Javascript
Knockout text绑定DOM的使用方法
Nov 15 Javascript
js的隐含参数(arguments,callee,caller)使用方法
Jan 28 Javascript
浏览器缩放检测的js代码
Sep 28 Javascript
javascript模拟实现ajax加载框实例
Oct 15 Javascript
js对字符串进行编码的方法总结(推荐)
Nov 10 Javascript
JavaScript实现邮箱地址自动匹配功能代码
Nov 28 Javascript
javascript自执行函数
Feb 10 Javascript
jQuery实现搜索页面关键字的功能
Feb 16 Javascript
vue2.x 父组件监听子组件事件并传回信息的方法
Jul 17 Javascript
了解javascript中变量及函数的提升
May 27 Javascript
一看就会的vuex实现登录验证(附案例)
Jan 09 Javascript
Vue中的v-for指令不起效果的解决方法
Sep 27 #Javascript
在vue中使用v-bind:class的选项卡方法
Sep 27 #Javascript
解决Vue中引入swiper,在数据渲染的时候,发生不滑动的问题
Sep 27 #Javascript
详解如何在vue项目中使用lodop打印插件
Sep 27 #Javascript
浅谈在vue中使用mint-ui swipe遇到的问题
Sep 27 #Javascript
Vue引用Swiper4插件无法重写分页器样式的解决方法
Sep 27 #Javascript
swiper在angularjs中使用循环轮播失效的解决方法
Sep 27 #Javascript
You might like
咖啡与水的关系
2021/03/03 冲泡冲煮
apache2.2.4+mysql5.0.77+php5.2.8安装精简
2009/04/29 PHP
QQ登录 PHP OAuth示例代码
2011/07/20 PHP
php中stdClass的用法分析
2015/02/27 PHP
在WordPress中安装使用视频播放器插件Hana Flv Player
2016/01/04 PHP
PHP中利用sleep函数实现定时执行功能实现代码
2016/08/25 PHP
Ext中下拉列表ComboBox组件store数据格式用法介绍
2013/07/15 Javascript
使用原生js写的一个简单slider
2014/04/29 Javascript
jQuery简单几行代码实现tab切换
2015/03/10 Javascript
JavaScript中的getMilliseconds()方法使用详解
2015/06/10 Javascript
jquery对象与DOM对象转化
2017/02/08 Javascript
解决vue项目中type=”file“ change事件只执行一次的问题
2018/05/16 Javascript
js常用正则表达式集锦
2019/05/17 Javascript
小程序封装路由文件和路由方法(5种全解析)
2019/05/26 Javascript
vue 2.5.1 源码学习 之Vue.extend 和 data的合并策略
2019/06/04 Javascript
微信js-sdk 录音功能的示例代码
2019/11/01 Javascript
[02:03]DOTA2亚洲邀请赛 HGT战队出场宣传片
2015/02/07 DOTA
在Docker上部署Python的Flask框架的教程
2015/04/08 Python
谈谈python中GUI的选择
2018/03/01 Python
python 实现在一张图中绘制一个小的子图方法
2019/07/07 Python
python解释器spython使用及原理解析
2019/08/24 Python
深入理解Tensorflow中的masking和padding
2020/02/24 Python
numpy库reshape用法详解
2020/04/19 Python
详解Python3 定义一个跨越多行的字符串的多种方法
2020/09/06 Python
HTML5 声明兼容IE的写法
2011/05/16 HTML / CSS
仿酷狗html5手机音乐播放器主要部分代码
2013/05/15 HTML / CSS
有趣、实用和鼓舞人心的产品:Inspire Uplift
2019/11/05 全球购物
兰蔻俄罗斯官方网站:Lancome俄罗斯
2019/12/09 全球购物
韩语专业本科生求职信
2013/10/01 职场文书
创业计划书——互联网商机
2014/01/12 职场文书
小学数学课后反思
2014/04/23 职场文书
会计学专业求职信
2014/07/17 职场文书
英文感谢信格式
2015/01/21 职场文书
义诊活动总结
2015/02/04 职场文书
2015年少先队活动总结
2015/03/25 职场文书
mysql数据库隔离级别详解
2022/06/16 MySQL