More Premium Hugo Themes Premium Vue Themes

Vue Js Grid

:bento: Vue.js 2.x responsive grid system with smooth sorting, drag-n-drop and reordering

Vue Js Grid

:bento: Vue.js 2.x responsive grid system with smooth sorting, drag-n-drop and reordering

Author Avatar Theme by euvl
Github Stars Github Stars: 942
Last Commit Last Commit: May 17, 2020 -
First Commit Created: Aug 27, 2024 -
Vue Js Grid screenshot

Overview

The Vue.js Grid plugin is an experimental tool for creating fixed-size grids in Vue.js. Despite being in its early stages and not production-ready, it offers features such as draggable cells, sortable grids, and events handling for actions like reordering and deletion. The plugin provides a foundation for building dynamic grid interfaces in Vue.js.

Features

  • Fixed Size Grid: Create grids with predefined cell widths and heights.
  • Draggable Cells: Enable dragging of cells within the grid.
  • Sortability: Reorder grid cells easily.
  • Event Handling: Events like @change, @remove, @click, and @sort are available for customization.
  • Cell Template: Access list data, indexing, and sorting parameters easily.
  • Extensibility: Potential future enhancements include adding element insertion and tests.

Installation

To install the Vue.js Grid plugin, use the npm package manager with the following command:

npm install vue-js-grid

Summary

The Vue.js Grid plugin offers a foundational tool for creating fixed-size grids in Vue.js, allowing for draggable and sortable cells with flexible event handling. While still in the experimental stage, it provides a glimpse of its potential for building dynamic grid interfaces. Users can contribute to the development by reporting bugs, creating issues, or reaching out to the developer on Twitter. With planned future enhancements like element insertion and testing, this plugin shows promise for grid-based applications in Vue.js.