swiper輪播問題之一：輪播圖內容為動態數據生成時輪播圖無法自動輪播

        本人在用H5做移動端項目中使用Swiper遇到的兩個問題，因此加深了對Swiper的掌握，分享出來對剛開始接觸Swiper的童鞋們或多或少會有幫助。
        首先，new Swiper的初始化最后放在DOM后邊，即加載完<div class="swiper-container"></div>后立即初始化，如果不能寫在HTML內容的后面，則需要在頁面加載完成后再初始化：如放在window.onload = function() {
...}中或$(document).ready(function () {...})中，如果是動態數據加載，應該放在接口取值生成DOM后馬上初始化。

        下面是個兩個問題
        其一：(使用Swiper輪播插件ajax請求加載圖片時，無法滑動的問題)，最后找到swiper插件 api 有屬性是可以根據內容變動，自動初始化插件的。

        observer:true,//修改swiper自己或子元素時，自動初始化swiper
        observeParents:true,//修改swiper的父元素時，自動初始化swiper

        項目中引用了vue，banner圖是后台配置的，ajax請求后台接口數據后生成的，將var mySwiper = new Swiper(".swiper-container",{})放在了請求成功的代碼塊中，代碼如下：

vm.swiper = new Swiper('.swiper-container', {
    pagination: '.swiper-pagination',
    paginationClickable :true,
    centeredSlides: true,
    autoplay: 5000,
    autoplayDisableOnInteraction: false,
});

        但是輪播圖頁面刷新后不會自動播放，且小圓點分頁器只顯示1個，這個bug后來通過observer:true添加這個屬性完美的解決了。原因是因為banner圖是動態創建的，在插件開始初始化時，文檔流中沒用圖片，所以沒有創建相應寬度，通過調整js加載順序，問題是解決不了的。