How do two arrays of vue judge duplicate data?

is doing a tagging module, as follows:

clipboard.png

my problem: I can choose the same tag
the effect I want: the tag cannot choose the same
my first thought is to use v-if to determine whether two arrays have the same data, so that they can show and hide, but the logic will not write

.

the code is as follows:

<div class="form-control" style="cursor:text;height:auto" @click="GetFocus()">
    //
    <span class="tag" v-for="item in SelectLabel"><i class="el-icon-close"></i>{{item}}</span>
    //
    <input 
        type="text" 
        class="label_input" 
        placeholder="Search" 
        v-model="label_keyword"
        v-validate=""max:8"" 
        name="vee-max" 
        @keyup="loadLabel()">
    <div v-if="errors.first("vee-max")" class="tip">{{ errors.first("vee-max") }}</div>
</div>
<div>
    //
    <span 
        class="el-tag el-tag--warning tag-margin" 
        v-for="item in list_label" 
        @click="GetLabel(item.name)">{{item.name}}
    </span>
</div>


Hello, according to my opinion.

you can determine by indexOf during click whether the tag clicked is already in the array of tags to be displayed by . If you already have it, you no longer need to add it. No, enter push, and then render the array of tags to be displayed

.
Menu