Vue.js - V 모델은 숨겨진 입력

Question

바인딩 나는 다음과 같은 숨겨진 입력이 있습니다에서

<input id="myHiddenInput" 
    name="myHiddenInput" 
    type="hidden" 
    v-model="comment.myHiddenInput" 
    v-on:change="comment.myHiddenInput=$event.target.value"> 

var app = new Vue({ 
    el: '#app', 
    data: { 
    comment: {'myHiddenInput': ''} 
    } 
}) 

을 내 내가 숨겨진 값을 설정하고 다음과 같이 변경 이벤트를 트리거 자바 스크립트 fucntion :

var myFunction = function() { 

    $('#myHiddenInput').val(JSON.stringify(hiddentStuff)).trigger('change'); 

}; 

그러나 위의 방법은 작동하지 않습니다. 즉 양방향 바인딩이 작동하지 않습니다.

하지만이 작업을 수행 할 경우 작동 :

var myFunction = function() { 

    $('#myHiddenInput').val(JSON.stringify(hiddentStuff)).trigger('change'); 
    document.getElementById('myHiddenInput').dispatchEvent(new Event('change')); 

}; 

왜 그 자체로 충분하지 .trigger('change')이다, 왜 내가 dispatchEvent(new Event('change')) aswell를 호출해야합니까?

Answer 1

Vue와 함께 jquery를 사용하지 않는 것이 좋습니다.

this.comment.myHiddenInput = JSON.stringify(hiddentStuff); //Your new value here 

이 자동으로 입력을 업데이트하고 또한 변화를 트리거 :

시도는 바인더 제본 객체를 대신 VUE 방법을 변경합니다.