tag-input-vue v1.0.2

tagInputVue

一款可以输入标签的输入框的 vue 组件

example

Demo：https://liushuaipeng.cn/demo/tag-input-vue

install tag-input-vue

$ npm install tag-input-vue --save

Use(如何引入)

// 全局注册
import Vue from "vue";
import tagInput from "tag-input-vue";
// css可不引入，使用时重构样式（组件注重功能，没有过多的css）
import "tag-input-vue/dist/tag-input.css";
Vue.use(tagInput);
new Vue({});

在组件中使用

<template>
  <div class="tag-input-vue">
    <tag-input v-model="tagInputValue" :tagconfig="tagconfig"> </tag-input>
  </div>
</template>
<script>
// 组件内注册
import tagInput from "tag-input-vue";
// css可不引入，使用时重构样式（组件注重功能，没有过多的css）
import "tag-input-vue/dist/tag-input.css";
export default {
  // 组件内注册
  components: {
    tagInput
  },
  data() {
    return {
      tagconfig: [
        { id: 1, name: "日期" },
        { id: 2, name: "地点" },
        { id: 3, name: "任务" }
      ],
      tagInputValue: {}
    };
  }
};
</script>

Input Attributes