holiber / sl-vue-tree

Customizable draggable tree component for Vue.js
https://holiber.github.io/sl-vue-tree/
MIT License
345 stars 78 forks source link

Accordion style #45

Closed fazzomurata closed 5 years ago

fazzomurata commented 5 years ago

This is a great library. Thank you. I would like to know if it is possible to have a kind of accordion style that always only one folder can be opened while another will be closed.

holiber commented 5 years ago

Hi, you can use toggle event to handle this

      nodeToggled(node, event) {
        // the node has been toggled

        const tree = this.$refs.slVueTree;

        // collapse all nodes
        tree.traverse((node, nodeModel) => {
          Vue.set(nodeModel, 'isExpanded', false);
        });

        // expand the toggled node and its parents
        let path = [];
        node.path.forEach(ind => {
          path.push(ind);
          tree.updateNode(path, { isExpanded: true });
        })
      },