Функция изменения (выбора) компонента Vue не вызывается, если значение установлено из внешнего метода - PullRequest
Новая
       7

Функция изменения (выбора) компонента Vue не вызывается, если значение установлено из внешнего метода

0 голосов
/ 27 декабря 2018

Я использую Select в качестве компонента Vue и определяю его как шаблон. У меня определены данные компонентов и реквизиты.

var MyComponent = Vue.component('my-component',{

  template: "<select v-on:change=\"onAppSelected\"	\n"+ 
  "v-model:value=\"appId\">			        \n"+
  "<option v-for=\"appChoice in appChoices\" 		\n"+
  "v-bind:value=\"appChoice.id\">{{appChoice.name}}	\n"+
  "</option>										\n"+
  "</select>",
 
  methods: {
  	onAppSelected:function(event){
    	console.log("On Change Called:", this.item.serial)
    	console.log("Event Target:",event.target.value)      
    },
  	setValue: function(selValue) {
    	this.appId = selValue;      
    },
  }, 
});

Функция onAppSelected , определенная в шаблоне с помощью v-on: change, вызывается, если опция выбрана из раскрывающегося списка вручную.

Но эта функция onAppSelected не запускается, если значение выбора установлено из метода setValue .

Метод setValue Вызывается с внешней кнопки.

В этом случае также не помогает библиотека jquery lib .trigger ("change").

Полный код jsFiddle

Ссылка для полной реализации в js fiddle добавлена ​​для тестирования.проверьте вывод в консоли.

Может ли кто-нибудь помочь мне в этом.Заранее спасибо за чтение моей проблемы.

1 Ответ

0 голосов
/ 27 декабря 2018

из изменить |MDN ,

изменяет огонь для элементов <input>, <select> и <textarea>, когда изменение значения элемента совершается пользователем.В отличие от входного события, событие изменения не обязательно запускается для каждого изменения значения элемента.

Это означает, что событие изменения будет инициировано, только если значение «изменено» пользователем.Также не будет срабатывать, если пользователь выберет то же значение.

Вы можете использовать «watch» для обнаружения изменений: JSFiddle

...