5

我正在尝试实现https://github.com/jackocnr/intl-tel-input。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">

我相信解决方案是为此创建一个新指令，我尝试了以下方法：

删除了我实例化intlTelInputon的部分document.ready并改为：

Vue.directive('telinput', {
    bind: function(el) {
        $(el).intlTelInput({
            //options here...
    }
});

并添加v-telinput到我上面的HTML代码中。

有了这个，似乎没有任何效果。

我在那里想念什么？

4

1 回答 1

0

尝试使用@keyup 而不是@keydown

于 2018-07-07T03:56:51.457 回答