How to get the event of deleting chip?

[Nurbek]

Hello,
I am woriking with chips in Vue now,and I need to get an event when I delete the chip to modify my data source.
Could you provide it please?

[LeoLavanya Dhanaraj]

Hi Nurbek,

Greetings from Syncfusion support.

Based on your requirement, we have prepared a Vue Chips sample with the latest version. We have an event called delete which will trigger before removing the chip element. This will only apply if the Chip component's enableDelete property is enabled and its value is set to true.

Refer to the below mentioned code snippets.

[App.vue]

<ejs-chiplist id="chip" enableDelete="true" :delete="deleteIconHandler">

    <e-chips>

        <e-chip text="Andrew"></e-chip>

        …

    </e-chips>

</ejs-chiplist>

 

methods: {

    deleteIconHandler: function (e) {

        console.log("You can write your own customization");

    },

},

Sample : https://codesandbox.io/s/adoring-diffie-1g1kz6?file=/src/App.vue

Please check the attached sample and get back to us if you need any further assistance.

Regards,

Leo Lavanya Dhanaraj

[Nurbek]

Thank you!

[Shereen Shajahan]

Hi Nurbek,

If you are satisfied with our response, please mark it as an answer. Otherwise, please let us know if you have any further queries on this. We are happy to help you.

Regards,

Shereen