使用vue-tags-input Vue Js的删除方法

时间:2019-12-09 07:26:35

标签: vue.js vuejs2

我尝试在Vue Js的vue-tags-input中创建一个delete方法。我不确定如何获取索引。从这个标签。通常在删除方法中,我使用索引。

<vue-tags-input
    v-model="tagName"
    class="tags-input w-100 mt-0"
    @before-deleting-tag="deleteCustomerName"
    />

deleteCustomerName: function () {
    const id = this.editedItemId;
    const id_c = 33;  //right now I am not sure how to get id_c 

    // const deleted_user_name = this.customer_names[index].name;
    this.boxOne = "";
    this.$bvModal
        .msgBoxConfirm("Are you sure that you want to delete this ?", {
            okVariant: "danger",
            okTitle: "Delete",
            cancelTitle: "Cancel",
            centered: true
        })
        .then(confirm => {
            if (confirm) {
                deleteApi("/customers/" + id + "/" + id_c).then(() => {
                    this.$nextTick(() => {
                        // this.$emit('deleted',deleted_user_name)
                        // this.customer_names.splice(index, 1);  //usualy I do this, but now it doesn't now how index is
                        console.log('User deleted!');
                    });
                });
            }

        })
        .catch(error => {
            console.log(error);
        });
},

1 个答案:

答案 0 :(得分:0)

这里描述的是http://www.vue-tags-input.com/#/api/events。 before-deleting-tag返回index,tag,deleteTag[func],因此您需要在deleteCustomerName参数范围内设置参数。

deleteCustomerName: function (params) {
   console.log(params.index) 
   ....
}