當(dāng)頁(yè)面里有ajax請(qǐng)求數(shù)據(jù),然后渲染圖片的時(shí)候,dom會(huì)有展開的一瞬馍管,產(chǎn)品覺得無法接受,so...
想到了image的onload事件薪韩,當(dāng)圖片加載完成之后再顯示頁(yè)面
- 原生js
<img onload="get(this)" src="..." style="display: none"/>
<script type="text/javascript">
function get(ts){
ts.style.display = 'block'
}
</script>
- vue
div(:class="$style.main", v-show="show")
img(:src="datas.image", @load="loadImage")
data() {
return {
show: false,
}
},
methods:{
loadImage(){
let _this = this
_this.show = true
}
}
在圖片加載完成之后再顯示頁(yè)面确沸,就不會(huì)有圖片展開的感覺,完美解決~