Description
A Vue tree component that allows you to present hierarchically organized data in a nice and logical manner.
Liquor Tree alternatives and similar libraries
Based on the "Frameworks" category.
Alternatively, view Liquor Tree alternatives based on common mentions on social networks and blogs.
-
Cypress
Complete end-to-end testing framework for anything that runs in a browser and beyond. -
mocha
Simple, flexible, fun javascript test framework for node.js & the browser. -
Protractor
Protractor is an end-to-end test framework for AngularJS applications. -
TestCafe
Automated browser testing for the modern web development stack. -
DalekJS
Automated cross browser functional testing with JavaScript -
FrintJS
Modular JavaScript framework for building scalable and reactive applications -
Webix UI
Stable releases of Webix UI - JavaScript library for building mobile and desktop web apps
Scout APM - Leading-edge performance monitoring starting at $39/month
* Code Quality Rankings and insights are calculated and provided by Lumnify.
They vary from L1 to L5 with "L5" being the highest. Visit our partner's website for more details.
Do you think we are missing an alternative of Liquor Tree or a related project?
README
Liquor Tree
A Vue tree component that allows you to present hierarchically organized data in a nice and logical manner.
Features
- drag&drop
- mobile friendly
- events for every action
- flexible configuration
- any number of instances per page
- multi selection
- keyboard navigation
- filtering
- sorting
- integration with Vuex
Installation
Npm:
$ npm install liquor-tree
Yarn:
$ yarn add liquor-tree
Live Playground
To run that demo on your own computer:
- Clone this repository
npm install
npm run build
npm run storybook
- Visit
http://localhost:9001/
There are a lot of examples for you. All sources of stories are located in liquor-tree/docs/storybook/stories
.
Usage
<!-- Vue Component -->
<template>
<tree
:data="items"
:options="options"
ref="tree"
/>
</template>
<script>
import Vue from 'Vue'
import LiquorTree from 'liquor-tree'
Vue.use(LiquorTree)
export default {
...
data() {
return {
items: [
{text: 'Item 1'},
{text: 'Item 2'},
{text: 'Item 3', children: [
{text: 'Item 3.1'},
{text: 'Item 3.2'}
]}
],
options: {
checkbox: true
}
}
}
...
}
</script>
Development
Check out the package.json
s script section. There are 2 scripts:
npm run dev
- it will open browser and you can play with codenpm run build
- it will craete a module file inproduction
mode
License
*Note that all licence references and agreements mentioned in the Liquor Tree README section above
are relevant to that project's source code only.