vue2-muuri

Vue binding for haltu/muuri (responsive, sortable, filterable and draggable grid layouts)

Usage no npm install needed!

<script type="module">
  import vue2Muuri from 'https://cdn.skypack.dev/vue2-muuri';
</script>

README

vue2-muuri

Muuri is a JavaScript layout engine that allows you to build all kinds of layouts and make them responsive, sortable, filterable, draggable and/or animated.

Install

npm install vue2-muuri

Usage

<MGrid
    ref="grid"
    container-class="grid"
    item-class="item"
    :show-duration="300"
  >
    <MItem class="item">
      Item 1
    </MItem>
    <MItem class="item">
      Item 2
    </MItem>
    <MItem class="item">
      Item 3
    </MItem>
  </MGrid>

Run demo

npm run demo

TODO

we use layoutSettings as alias of muuri's layout option
pass item methods
declarative sort + declarative