Vue公司JS - 多選 - 在哪裏添加事件？

Question

我使用的laravel項目http://monterail.github.io/vue-multiselect/ Vue的插件，我試圖讓標記選項工作。這是工作，但是當我添加標籤JS我無法用咕嘟咕嘟建設。

這是我曾嘗試：

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> 

的標記代碼

我需要的地方添加此代碼，但無論我已經試過在構建或控制檯拋出錯誤。

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分量method event handler，類似以下內容：

進口多選從 '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 
     } 
    } 
})