Использование дочернего компонента в v-select - PullRequest
Новая
       20

Использование дочернего компонента в v-select

0 голосов
/ 12 июня 2019

Я пытаюсь включить кнопку скрытия для каждого элемента в v-select при открытии.Нажатие на кнопку должно удалить элемент из массива çurrentTags. 

<link rel="stylesheet" href="https://unpkg.com/vue-select/dist/vue-select.css" type="text/css">
<script src="https://unpkg.com/vue@latest"></script>
<script src="https://unpkg.com/vue-select@latest"></script>

<div id="app">
<v-select  :components="{tag-hide}" taggable multiple :options="currentTags" v-model="newTag"></v-select>
</div>

Vue.component('v-select', VueSelect.VueSelect)

Vue.component('tag-hide', {
  data: function () {
    return {
    }
  },
  methods: {
    hideTag: function(){
      //retrieve tag and remove from currentTags
    }
  },
  template: '<div><button @click="hideTag(currentTags.[])">Hide</button> 
</div>'
});

new Vue({
  el: '#app',
  data() {
    return {
      newTag: [],
      currentTags: ['#aa','#bb','#cc']
    }
  }
});

Ожидается, что рядом с каждым элементом currentTags будет отображаться кнопка скрытия.При нажатии кнопки текущий тег передается методу, который удаляет тег из массива currentTags.

...