Как узнать, когда JQuery загружается из директивы Vue? - PullRequest
0 голосов
/ 05 марта 2020

У меня есть директива Vue, которая использует плагин JQuery для применения маски ввода к входу (требования моего босса, она должна работать с JQuery и плагином, который загружает _Layout страницы). Хорошо, пока что я сделал следующее:

const directive = (function createDirective() {

    // . . .

    function dispatchToVue (e) {
        const vueEv = new Event('input', { bubbles: true });
        e.target.dispatchEvent(vueEv);
    }

    function registerMask(el, binding) {
        $(function () {
            const $el = $(el);
            const maskConfig = getMaskConfig(binding);

            $el.maskMoney(maskConfig);
            $el.maskMoney('mask');
            el.addEventListener('keyup', dispatchToVue);
        });
    }

    return {
        bind: function (el, binding, vnode) {

            // Checks if JQuery is loaded
            function checkJquery() {
                if ($) {
                    registerMask(el, binding);
                } else {
                    setTimeout(function () {
                        checkJquery();
                    }, 500);
                }                
            }

            checkJquery();
        },
        update: function (el, binding, vnode) {
            // . . .
        }
    };

}());

export default directive;

Это работает, но, как вы можете видеть, у меня есть таймер, который проверяет каждую полсекунду, если загружен JQuery, что неоптимально. Просматривая inte rnet, я нашел статью о том, как работать с Vue и JQuery, но он использует жизненный цикл mount компонента, чтобы знать, когда компонент может использовать JQuery. Согласно директиве, у меня нет этой возможности.

Есть идеи? Заранее спасибо.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...