0.3.2 • Published 1 year ago

ecej-v3-waterfull v0.3.2

Weekly downloads
-
License
ISC
Repository
-
Last release
1 year ago

Ecej-V3-Watrefull

基于 Vue 3 + TypeScript + Vite 构建的瀑布流组件

  • 自定义插槽类商城结构瀑布流
  • 自定义瀑布流展示列数,默认两列
  • 自定义瀑布流行列间距,默认 20px
  • 自定义瀑布流行列间距单位
  • 支持动态 dom 渲染

安装

npm i  ecej-v3-waterfull
//or
yarn add  ecej-v3-waterfull

使用

// main.ts 引入
import waterfull from "ecej-v3-waterfull";
const app = createApp(App);
app.use(waterfull);
app.mount("#app");
//组件中使用,waterFull名称不能修改
 <waterFull v-slot="slotProps" :fullDatas="dataLists" :column="2">
    <!-- content... -->
  </waterFull>

属性

属性名类型默认值必填说明
fullDatasarray-瀑布流数据
columnnumber2列数
columnSpacingnumber20列间距
rowSpacingnumber20行间距
unitstringpx间距单位
  • 间距自定义单位,默认 px 可设置 rem,%
  • (用于部分移动端项目使用 rem 忽略 node_modules 文件 px2rem 时)

更新

  • 0.3.x 版本后支持动态 dom 瀑布流加载(分页长列表)
  • 修复了 0.2.x 版本数据在 tab 切换情况下使用插件 dom 不更新的 bug

插槽

  • v-slot="slotProps",插槽提供 item 及 index 两个参数
0.3.0

1 year ago

0.3.2

1 year ago

0.3.1

1 year ago

0.2.1

1 year ago

0.2.0

1 year ago

0.2.6

1 year ago

0.2.3

1 year ago

0.2.2

1 year ago

0.1.3

1 year ago

0.2.5

1 year ago

0.2.4

1 year ago

0.1.0

1 year ago