변경 옵션에서 VueJS 선택 지시문이 업데이트되지 않음

Question

VueJS를 사용하여 AJAX를 통해 jQuery Chosen 드롭 다운 필드를 채우려 고했지만 새로운 값을 적용하면 Chosen 드롭 다운이 업데이트되지 않습니다.

내가 AJAX 응답을받을 때 수동으로 트리거하는 $('.cs-select').trigger("chosen:updated");과 같은 여러 가지를 시도했지만 VueJS가 모든 드롭 다운 결과를 구문 분석하는 데 몇 초가 필요하기 때문에 작동하지 않는다고 생각합니다 (약 20 개의 동일한 값이 있습니다. 한 페이지). http://jsfiddle.net/qfy6s9Lj/106/

누구나 쉽게 수정을 가지고 : 모든 그러나 단지 준비가 없음-JS 드롭 다운 메뉴에 표시하면 다음

작동하지 않는 예를

, 나는 도시 암스테르담을 추가입니까? 나는 setTimeout()을 사용하는 것처럼 느껴진다.

Answer 1

여기 하나의 해결책이 있지만 약간의 작업이 필요합니다. 먼저 1.0 버전의 Vue를 사용하여 업데이트하면 매개 변수 값에 액세스 할 수 있습니다.이 값은 cities 배열 참조 (https://vuejs.org/guide/custom-directive.html#params)에 항목을 추가 할 때 감시자를 설정할 수 있도록합니다. 그러나 1.0에서 수동으로 옵션 요소를 작성해야하기 때문에 옵션 목록을 표시하려면 v-for을 사용해야합니다. https://vuejs.org/guide/forms.html#Select

나는 그것이 작동하지 않는다고 생각합니다. 사용자 지정 지시문에서 옵션이 변경되면 해당 변경을 수신 할 것이 없기 때문입니다. update 함수는 v-chosen에 제공된 변수의 변경 사항 만 수신합니다.

필요에 따라 시간대를 2.0으로 업그레이드 할 수 있습니다. 아직 베타 버전이지만 공식 출시가 가까워지고 있습니다. 2.0에서는 플러그인 (예 : https://github.com/vuejs/vue/blob/next/examples/select2/index.html)을 처리하기위한 사용자 정의 구성 요소를 생성합니다. 이것은 1.0의 지시문이었으며 이제는 2.0의 구성 요소입니다.