記錄幾個vue-masonry插件使用中的坑:
1 引入方法:
通過npm i vue-masonry以後,引入方法是
import {VueMasonryPlugin} from 'vue-masonry';
我用的版本是0.11.8
而不是網上很多文字寫的那樣 import masonry from 'vue-masonry';如npm 官方包所述(個別人發佈文章非常不負責任,誤人子弟)
2 一定要記得給item選項添加 v-masonry-tile屬性。vue-masonry作者在npm官方說明也及其不負責任,這個屬性幾乎不提。如果不設置該屬性。item下的元素不會出現。如圖
3 慎用 fit-width="true" 。一定要把這個屬性設置爲false。不然會出現比如4張圖片原本是22排列。結果出現前兩週圖片重合,而後兩張圖片按瀑布流方式排列的現象。
4 我的項目實例中用到了tab標籤頁切換。初始化的時候點擊各個tab標籤頁沒有問題。但是第二輪點擊的時候發現問題如下:
圖片擠在了一起。定位出現錯位。
解決辦法:
每次切換tab標籤頁時都把數據清空一下。最後正常