1.0.0 • Published 5 years ago
vue-waterfall-unit v1.0.0
vue-waterfall-unit
基于vue的瀑布流组件( pc端、手机端 )
Example
npm引入
npm i vue-waterfall-unit -S
import vueWaterfallUnit from 'vue-waterfall-unit'
使用示例
<vue-waterfall-unit
:list="list"
:spacing="10"
:column="8"
:load-change="loadChange"
containerType="parent"
>
<template v-slot:item="water">
<div class="image-item">
<img :src="water.data.src" alt="" width="100%" @load="loadChange = !loadChange"/>
<div style="padding: 5px 10px; font-size: 14px; text-align: center;">{{water.data.name}}</div>
</div>
</template>
</vue-waterfall-unit>
参数
参数 | 参数说明 | 参数类型 | 可选值 |
---|---|---|---|
list | 内容数组 | Array | |
spacing | 列间距和行间距 | Number | 大于0的数字 |
column | 列数 | Number | 大于0的数字 |
containerType | 父盒子类型 | String | {parent: '父盒子', other: '可视区域宽度'} |
loadChange | 加载完改变触发刷新(图片等加载完成等) | Boolean | false/true |
1.0.0
5 years ago