Nuxt.js で vue-input-tag を使ってみるメモ

Nuxt.js でやってみる

plugins

新規作成

• src/plugins/vue-input-tag.js

import Vue from 'vue'
import VueInputTag from 'vue-input-tag'

Vue.component('vue-input-tag', VueInputTag)

nuxt.config.js に設定を追加

  plugins: [
    { src: '@/plugins/vue-input-tag', ssr: false },
  ],

pages

抜粋

<template>
  <section>
      <vue-input-tag :tags.sync="form.tags" />
  </section>
</template>

<script>
export default {
  data () {
    return {
      form: {tags: ['hoge']},
    }
  },
}

こんな感じ

codepen で動かすとこんな感じなやつ

See the Pen sample-vue-input-tag by Takashi ITO (@cortyuming) on CodePen.

参考リンク

GitHub - matiastucci/vue-input-tag: Vue.js 2.0 Input Tag Component