Vue瀑布流插件的使用示例

原创 Fly丶 教程 vue专题 99阅读 29 天前 举报

我自己写的一个的Vue瀑布流插件,列数自适应,不用设置每个卡片的高度。

测试页面:Page.vue
模板页面:WaterFollow.vue 和 WFColumn.vue

在Page.vue中,修改itemW的值,设置每列的最小宽度。例如:itemW="200"(意为200px)。list为数组。高度不用设置,:style="{height:item+'px'}"是我为了创造卡片高度加上去的,不加就显示卡片的原来大小。

经测试,created加载数据正常,mounted加载、更新数据正常。

Page.vue

WFColumn.vue

WaterFollow.vue

评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复