Select2 и Vue: динамически загружаемые данные - PullRequest
Новая
       6

Select2 и Vue: динамически загружаемые данные

0 голосов
/ 02 марта 2020

Я выполнил директиву Vue, чтобы получить выбранное значение в раскрывающемся списке select2. Это работает отлично, но проблема, с которой я сталкиваюсь, состоит в том, что мой Select2 загружает данные динамически. Когда я нажимаю на него, он вызывает ajax и получает значения, которые он должен показать. Это проблема, потому что, когда я устанавливаю значение для моего выпадающего списка select2, но, так как значение не существует во время его установки, оно не отображается в раскрывающемся списке. Можно ли в любом случае сделать вызов ajax специально для значения, которое я устанавливаю, до того, как оно будет установлено в раскрывающемся списке? Вот моя директива: 

Vue.directive('select2', {
    inserted(el) {
        $(el).on('select2:select', () => {
            const event = new Event('change', { bubbles: true, cancelable: true })
            el.dispatchEvent(event)
        })

        $(el).on('select2:unselect', () => {
            const event = new Event('change', {bubbles: true, cancelable: true})
            el.dispatchEvent(event)
        })
    }
})

var app = new Vue({
    el: '#app',
    data: {
        PersonType: '1'
    }
})

      <select class="js-example-basic-single" id="PersonType" data-apiurl="PersonType"
              v-select2 v-model="PersonType" name="PersonType" style="width: 100%;">
      </select>
...