解决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中令你抓狂的魔术变量
Nov 30 Javascript
jQuery 连续列表实现代码
Dec 21 Javascript
基于JQuery的密码强度验证代码
Mar 01 Javascript
ASP.NET中基于JQUERY的高性能的TreeView补充
Feb 23 Javascript
javascript高级学习笔记整理
Aug 14 Javascript
使用js的replace()方法查找字符示例代码
Oct 28 Javascript
gameboy网页闯关游戏(riddle webgame)--仿微信聊天的前端页面设计和难点
Feb 21 Javascript
JavaScript操作表单实例讲解(上)
Jun 20 Javascript
jQuery使用ajax方法解析返回的json数据功能示例
Jan 10 Javascript
Vue入门之数据绑定(小结)
Jan 08 Javascript
新手快速入门微信小程序组件库 iView Weapp
Jun 24 Javascript
微信小程序之导航滑块视图容器功能的实现代码(简单两步)
Jun 19 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
web方式ftp
2006/10/09 PHP
php生成图片验证码的方法
2016/04/15 PHP
Win10 下安装配置IIS + MySQL + nginx + php7.1.7
2017/08/04 PHP
PHP编程实现阳历转换为阴历的方法实例
2017/08/08 PHP
Laravel 5.5基于内置的Auth模块实现前后台登陆详解
2017/12/21 PHP
PHP给前端返回一个JSON对象的实例讲解
2018/05/31 PHP
javascript-TreeView父子联动效果保持节点状态一致
2007/08/12 Javascript
下载网站打开页面后间隔多少时间才显示下载链接地址的代码
2010/04/25 Javascript
Javascript的数组与字典用法与遍历对象的属性技巧
2012/11/07 Javascript
jQuery中读取json文件示例代码
2013/05/10 Javascript
jQuery不使用插件及swf实现无刷新文件上传
2014/12/08 Javascript
浅谈Jquery为元素绑定事件
2015/04/27 Javascript
jquery表单验证需要做些什么
2015/11/17 Javascript
jquery实现树形菜单完整代码
2015/12/29 Javascript
ES6中Symbol类型用法实例详解
2017/04/06 Javascript
Angular.js实现动态加载组件详解
2017/05/28 Javascript
浅谈Vue.js 1.x 和 2.x 实例的生命周期
2017/07/25 Javascript
服务端预渲染之Nuxt(使用篇)
2019/04/08 Javascript
Python中的元类编程入门指引
2015/04/15 Python
Python使用functools模块中的partial函数生成偏函数
2016/07/02 Python
浅谈Python基础之I/O模型
2017/05/11 Python
python出现&quot;IndentationError: unexpected indent&quot;错误解决办法
2017/10/15 Python
PyCharm安装Markdown插件的两种方法
2019/06/24 Python
python判断链表是否有环的实例代码
2020/01/31 Python
HTML5 声明兼容IE的写法
2011/05/16 HTML / CSS
html5拖曳操作 HTML5实现网页元素的拖放操作
2013/01/02 HTML / CSS
俄罗斯最大的在线手表商店:Bestwatch.ru
2020/01/11 全球购物
学前教育毕业生自荐信
2013/10/29 职场文书
《第一次抱母亲》教学反思
2014/04/16 职场文书
中学优秀班主任事迹材料
2014/05/01 职场文书
2015年建筑工作总结报告
2015/05/04 职场文书
员工辞职信范文大全
2015/05/12 职场文书
2015年汽车销售员工作总结
2015/07/24 职场文书
领导离职感言
2015/08/03 职场文书
浅谈:电影《孔子》观后感(范文)
2019/10/14 职场文书
springboot新建项目pom.xml文件第一行报错的解决
2022/01/18 Java/Android