Disable ability click to remove selected item on VueTreeselect

189 Views Asked by At

I'm using the VueTreeselect but the library does not support any prop to disable the ability click to deselect a selected option. I have a tooltip that wraps each selected option that's why i can't use the pointer-events: none;.I can't even add a click handler to "value-label" slot Can anyone show me a way to disable the click but still can hover

Below is my code

<treeselect :multiple="true" :options="options" :flat="true" v-model="selectedItems":backspaceRemoves="false">
  <div slot="value-label" slot-scope="{ node }">
    <el-tooltip :content="node.raw.label" placement="bottom" :disabled="node.raw.label < 10">
      <span>{{node.raw.label}}</span>
    </el-tooltip>
  </div>
</treeselect>
1

There are 1 best solutions below

4
Keyboard Corporation On

Vue treeselect has Disable Item Selection.

For this case, I use function to change the value of isDisabled to true, so the item will disable, but still showing the tooltip.

Demo