Vue js - マルチセレクション - イベントを追加する場所は？

Question

私はlaravelプロジェクトでhttp://monterail.github.io/vue-multiselect/ Vueプラグインを使用しています。私は動作するようにタグ付けオプションを取得しようとしています。動作していますが、タグ付けJSを追加するとGulpを使用してビルドできません。ここで

は、私が試したものです：

VUE JSを

Vue.component('dropdown', require('./components/Multiselect.vue')); 

const app = new Vue({ 
    el: '#app' 
}); 

COMPONENT

<template> 
    <div> 
    <p>Multi Select</p> 
    <multiselect 
     :options="taggingOptions" 
     :value="taggingSelected" 
     :multiple="true" 
     :searchable="searchable" 
     :taggable="true" 
     :on-tag="callback" 
     @tag="addTag" 
     @input="updateSelectedTagging" 
     tag-placeholder="Add this as new tag" 
     placeholder="Type to search or add tag" 
     label="name" 
     track-by="code"> 
    </multiselect> 
    </div> 
</template> 


<script> 
    import Multiselect from 'vue-multiselect' 

    export default { 
     components: { Multiselect }, 
     data() { 
     return { 
      value: null, 
      options: ['list', 'of', 'options'] 
     } 
     }, 
     methods: { 
     updateSelected (newSelected) { 
      this.value = newSelected 
     } 
     } 
    }; 
</script> 

タギングCODE

私はこのコードをどこかに追加する必要がありますが、どこでもビルドやコンソールにエラーがスローされました。

あなたは、あなたのVueのコンポーネントに method event handlerとして次のようなもの、このコードを追加する必要があり

addTag (newTag) { 
const tag = { 
name: newTag, 
// Just for example needs as we use Array of Objects that should have other properties filled. 
// For primitive values you can simply push the tag into options and selected arrays. 
code: newTag.substring(0, 2) + Math.floor((Math.random() * 10000000)) 
} 
this.taggingOptions.push(tag) 
this.taggingSelected.push(tag) 
}, 
updateSelectedTagging (value) { 
console.log('@tag: ', value) 
this.taggingSelected = value 
} 

Answer 1

：

インポート複数選択 'をVUE-複数選択' からの

export default { 
    components: { Multiselect }, 
    data() { 
    return { 
     value: null, 
     options: ['list', 'of', 'options'] 
    } 
    }, 
    methods: { 
    addTag (newTag) { 
     const tag = { 
      name: newTag, 
      // Just for example needs as we use Array of Objects that should have other properties filled. 
      // For primitive values you can simply push the tag into options and   selected arrays. 
      code: newTag.substring(0, 2) + Math.floor((Math.random() * 10000000)) 
      } 
      this.taggingOptions.push(tag) 
      this.taggingSelected.push(tag) 
     }, 
     updateSelectedTagging (value) { 
      console.log('@tag: ', value) 
      this.taggingSelected = value 
     } 
    } 
})