今天采用vue+swiper開(kāi)發(fā)氧苍,如果是靜態(tài)圖片崇猫,不通過(guò)請(qǐng)求服務(wù)器的方式是正常顯示的,且可以左右滑動(dòng)swiper匾委。
如果是靜態(tài)頁(yè)面這樣可以解決問(wèn)題
vm = new Vue({
el: "#container",
mounted() {
var swiper = new Swiper('.swiper-container', {
slidesPerView: 3,
slidesPerColumn: 2,
spaceBetween: 5,
pagination: {
el: '.swiper-pagination',
clickable: true,
},
});
},
methods: {
},
data: {
}
});
如果是動(dòng)態(tài)網(wǎng)頁(yè)拖叙,需要請(qǐng)求服務(wù),需要這樣解決
function readData(){
//這是一個(gè)請(qǐng)求網(wǎng)絡(luò)服務(wù)器的方法
getRequestPromise(requestUrl).then(function (dataValue) {
return dataValue;
}).then(function (dataValue) {
//顯示swiper
setTimeout(function () {
var swiper = new Swiper('.swiper-container', {
slidesPerView: 3,
slidesPerColumn: 2,
spaceBetween: 5,
pagination: {
el: '.swiper-pagination',
clickable: true,
},
});
document.findId('#usnatu_flex_row_style').style.visibility = "visible";//顯示
},200);
}
}).catch(function (error) {
console.log(error.message);
});
}