Vue-jstree

<v-jstree :data="data" show-checkbox multiple allow-batch whole-row @item-click="itemClick"></v-jstree>
    
    new Vue({
      data: {
        data: [
          {
            "text": "Same but with checkboxes",
            "children": [
              {
                "text": "initially selected",
                "selected": true
              },
              {
                "text": "custom icon",
                "icon": "fa fa-warning icon-state-danger"
              },
              {
                "text": "initially open",
                "icon": "fa fa-folder icon-state-default",
                "opened": true,
                "children": [
                  {
                    "text": "Another node"
                  }
                ]
              },
              {
                "text": "custom icon",
                "icon": "fa fa-warning icon-state-warning"
              },
              {
                "text": "disabled node",
                "icon": "fa fa-check icon-state-success",
                "disabled": true
              }
            ]
          },
          {
            "text": "Same but with checkboxes",
            "opened": true,
            "children": [
              {
                "text": "initially selected",
                "selected": true
              },
              {
                "text": "custom icon",
                "icon": "fa fa-warning icon-state-danger"
              },
              {
                "text": "initially open",
                "icon": "fa fa-folder icon-state-default",
                "opened": true,
                "children": [
                  {
                    "text": "Another node"
                  }
                ]
              },
              {
                "text": "custom icon",
                "icon": "fa fa-warning icon-state-warning"
              },
              {
                "text": "disabled node",
                "icon": "fa fa-check icon-state-success",
                "disabled": true
              }
            ]
          },
          {
            "text": "And wholerow selection"
          }
        ]
      },
      methods: {
        itemClick (node) {
          console.log(node.model.text + ' clicked !')
        }
      }
    })

Source: npmjs.com

Similar codes

7 votes328 views1 answer
Vue js Elements in iteration expect to have 'v-bind:key' directives
Javascript Vue
0 vote317 views1 answer
Await vuex dispatch true
Javascript Vue
4 votes307 views2 answers
Vue router url string
Javascript Vue
3 votes290 views2 answers
Countdown using vue
Javascript Vue
0 vote296 views2 answers
Vuejs filter array by dates
Javascript Vue
1 vote270 views3 answers
Vue router npm install
Javascript Vue
5 votes302 views1 answer
Comment in vue js
Javascript Vue
1 vote292 views1 answer
Vue directive parameter
Javascript Vue
0 vote299 views1 answer
Vuejs v-model when enter pressed
Javascript Vue
0 vote278 views1 answer
Vue reset all data to default
Javascript Vue