我正在尝试实施https://github.com/jackocnr/intl-tel-input https://github.com/jackocnr/intl-tel-input with vuejs2
.
如果我在一个 jQuery 中添加document.ready
, $('#phone').intlTelInput({ options...})
一切都按预期工作,但是当我尝试获取输入字段的值和一些boolean
有效的财产,我总是落后一步检查价值。
我的检查方法如下:
validatePhoneNumber: function() {
var validPhoneNo = $("#phone").intlTelInput("isValidNumber");
var phoneNo = $("#phone").intlTelInput("getNumber");
console.log(phoneNo + ' -> ' + validPhoneNo); //this line returns values one step behind
bus.$emit('validate-phone', validPhoneNo)
}
HTML:
<input class="form-control" @keydown="validatePhoneNumber" :class="{validInput: validPhone }" type="text" name="phone" value="" id="phone" :phone_number="phone_number">
我相信解决方案是为此问题创建一个新指令,我尝试了以下操作:
删除了我实例化的部分intlTelInput
on document.ready
并做了这个:
Vue.directive('telinput', {
bind: function(el) {
$(el).intlTelInput({
//options here...
}
});
并添加了v-telinput
to my HTML
上面的代码。
有了这个,似乎没有任何作用。
我在那里缺少什么?