解決betterScroll在vue中存在圖片時,出現(xiàn)拉不動的問題
更新時間：2018年09月27日 11:19:52 作者：Mr航
今天小編就為大家分享一篇解決betterScroll在vue中存在圖片時,出現(xiàn)拉不動的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
1.先寫一個圖片加載的方法
class ImgLoadClass {
static preloadImages = (arr) => {
//已經加載完的圖片數(shù)量
let loadeImage = 0
//存放圖片的數(shù)組
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中存在圖片時,出現(xiàn)拉不動的問題就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關文章
Electron相當于一個瀏覽器的外殼，可以把網頁程序嵌入到殼里面，可以運行在桌面上的一個程序，可以把網頁打包成一個在桌面運行的程序。這篇文章主要介紹了electron-vue多顯示屏下將新窗口投放是其他屏幕 ,需要的朋友可以參考下2019-07-07
這篇文章主要為大家介紹了vue修改數(shù)據(jù)視圖更新原理學習，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-11-11
keep-alive是Vue中一個非常有用的特性,它可以幫助我們避免重復渲染和減少組件的渲染次數(shù),從而提高應用程序的性能,本文給大家介紹keep-alive組件緩存的相關知識,感興趣的朋友一起看看吧2024-01-01
關于vue中根據(jù)用戶權限動態(tài)添加路由的問題
每次路由發(fā)生變化時都需要調用一次路由守衛(wèi)，并且store中的數(shù)據(jù)會在每次刷新的時候清空，因此需要判斷store中是否有添加的動態(tài)路由，本文給大家分享vue中根據(jù)用戶權限動態(tài)添加路由的問題，感興趣的朋友一起看看吧2021-11-11
本篇文章主要介紹了手把手教你使用vue-cli腳手架(圖文解析)，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-11-11
這篇文章主要為大家詳細介紹了vue的全選組件封裝，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助2022-02-02
詳解利用eventemitter2實現(xiàn)Vue組件通信
這篇文章主要介紹了詳解利用eventemitter2實現(xiàn)Vue組件通信，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2019-11-11
這篇文章主要介紹了vue?@click?@tap重疊事件區(qū)分方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-03-03
在項目開發(fā)中,經常會用到svg圖標,之前用的都是vue-svg-icon,接下來通過本文給大家介紹Vue中使用SVG-ICON的配置方法,感興趣的朋友跟隨小編一起看看吧2024-02-02
這篇文章主要介紹了Vue項目使用svg圖標實踐，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-09-09