vue-flow-layout

🌊 The Vue waterfull layout component.

Features

• 🌊 Waterfull layout
• 📦 Lightweight
• 🎨 Elegant transition
• 📱 Responsive

Install

pnpm add vue-flow-layout

Usage

import { createApp } from 'vue'
import VueFlowLayout from 'vue-flow-layout'
import App from './App.vue'

createApp(App).use(VueFlowLayout).mount('#app')

Use in your component:

<template>
  <FlowLayout>
    <div v-for="i in 100" :key="i" class="item">
      {{ i }}
    </div>
  </FlowLayout>
</template>

Props

Name	Type	Default	Description
cols	number	2	The number of columns
gap	number | [number, number]	4	The gap between items for X
duration	number	350ms	The transition duration

Credits

• wc-flow-layout

license

MIT