vue-masonry踩坑記錄

記錄幾個vue-masonry插件使用中的坑:

1 引入方法:

通過npm i vue-masonry以後,引入方法是

import {VueMasonryPlugin} from 'vue-masonry';

我用的版本是0.11.8

而不是網上很多文字寫的那樣 import masonry from 'vue-masonry';如npm 官方包所述(個別人發佈文章非常不負責任,誤人子弟)

 

一定要記得給item選項添加  v-masonry-tile屬性。vue-masonry作者在npm官方說明也及其不負責任,這個屬性幾乎不提。如果不設置該屬性。item下的元素不會出現。如圖

3 慎用 fit-width="true" 。一定要把這個屬性設置爲false。不然會出現比如4張圖片原本是22排列。結果出現前兩週圖片重合,而後兩張圖片按瀑布流方式排列的現象。

4 我的項目實例中用到了tab標籤頁切換。初始化的時候點擊各個tab標籤頁沒有問題。但是第二輪點擊的時候發現問題如下:

 

圖片擠在了一起。定位出現錯位。

解決辦法:

每次切換tab標籤頁時都把數據清空一下。最後正常

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章