vue-tags-input

文档链接:http://www.vue-tags-input.com/#/examples/autocomplete

 需求: 输入英文状态逗号、分号、空格、回车进行分隔,也可联想输入

npm install @johmun/vue-tags-input
import VueTagsInput from '@johmun/vue-tags-input';
<vue-tags-input :preventAddingDuplicates="false" v-model="tag" :tags="tags" :autocomplete-items="autocompleteItems" :add-on-key="[';', ',', ' ', 13]" @tags-changed="newTags => tags = newTags" />
        
add-on-key: 按下其中之一,则会从输入值中生成一个标签,可以接受keycode值(回车:13)
autocompleteItems: 联想的数据
data() {
            return {
                tag:'',
                tags: [],
                autocompleteItems: [
                    {text: '张三'},
                    {text: '李四'},
                    {text: '王五'},
                    {text: '麻子'},
                    {text: '小二'},
                    {text: '王八'},
                ]
            };
        },





原文地址:https://www.cnblogs.com/xhrr/p/14156226.html