2016-12-15 4 views
1

으로 트리거되지 않습니다.뷰의 V 모델을 사용하면 내가 같이 사용자가 선택 입력을 변경 제대로 할 때, <code>mySelectValue</code>가 업데이트</p> <pre><code><select v-model="mySelectValue"> <option v-for=...>...</option> </select> </code></pre> <p>로 정의 된 선택 요소가 타사 드롭 다운

이제 입력 스타일을 지정하고 싶습니다. 나는 Selectize.js을 시도하십시오 선택 입력이 이제 새로운 모습과 기능을 사용하고 있지만 mySelectValue를 업데이트하지 않습니다 값을 변경한다

$('select').selectize(); 

. 나는 원래의 select 입력이 Selectize.js로 업데이트되어 Dropdown.js을 시도했다고 생각했다. 같은 것.

는 jQuery를 사용하여 나는 원래 선택 입력으로 변경 리스너에를 걸려 :

$('#mySelect').change(function() { 
    console.log($(this).val()); 
}); 

내가 변경 이벤트가 트리거와 원래의 선택 입력이 업데이트 볼이 두 라이브러리 중 하나를 사용.

왜 Vue가 업데이트되지 않는가 mySelectValue?

+0

에 값 속성을 추가해야합니까? 나는이 라이브러리가 DOM에서 요소를 제거하고 첨부 된 핸들러 등을 제거하는 다른 곳에서 다시 삽입한다고 생각합니다. –

+0

@MathewJibin DOM을 확인했습니다. 원본 요소는 그대로입니다. 두 라이브러리는'display : none'을 설정하고 원래의 select 요소 뒤에 자신 만의 사용자 정의 구조체를 삽입합니다. Chrome 개발자 도구를 사용하여 원래 요소를 다시 표시하고 값을 변경하려고 시도했습니다. 여전히 Vue에서 'v-model'변경을 유발합니다. 또한 원본과 사용자 지정 드롭 다운 중 하나가 다른 것으로 변경되면서 드롭 다운이 연결되었음을 시각적으로 확인했습니다. – Mikko

+0

jquery'val' 메소드를 사용하여 콘솔에서 값을 변경해보십시오. 여전히 트리거됩니까? 도서관 안의 어딘가에서 이벤트 버블을 억제하고있을 수도 있습니다. 순환적인 업데이트 또는 다른 것을 피할 수 있을까요? –

답변

0

당신은 당신이 이전 또는`전화 selectize` 후 변경 청취자를 구부려나요 <option>

<select v-model="mySelectValue"> 
    <option value='1'>one</option> 
    <option value='2'>two</option> 
    <option value='3'>three</option> 
</select> 
+0

값 속성이 있지만 질문의 스 니펫에서 값 속성을 제거했습니다. – Mikko