iview carousel 圖片不顯示；iview 輪播圖 圖片沒法顯示（轉載）

轉載來源：https://segmentfault.com/q/1010000016778108

 

 

相關代碼

<Carousel autoplay v-model="value2" v-if="uploadList!=''" loop>

<Carousel-Item v-for="(item,index) in uploadList" :key="index"> <div class="demo-carousel"> <img :src="item" style="height:241px;width:444px;" alt=""/> </div> </Carousel-Item>

</Carousel>

受@熊貓酒仙  簡便的方法，給carousel加一個v-if指令，值與你控制modal的booean值綁定，這樣carousel就會延遲初始化，達到計算listwidth不讓其未0的效果

這個問題是寬度爲0致使的。從源碼中能夠看出，寬度在頁面初始化（mounted）的時候就已經計算了，this.handleResize(); 我是把這個組件抽出來了，而後改了它的源碼，在 調用 updatePos 以前 執行一下 handleResize 就好了。下面給兩張圖