Задать вопрос
alexdeg
@alexdeg
Новатор

Как одновременно получить данные из callback и передать их в callback?

Добрый день.

Есть следующий код:

function box(nameBlock, options, callback) {
        var code = options.code ? options.code : [];
        var inputs = [];
        var currentBlock = document.querySelector('#' + nameBlock);

        for (var i = 0; i < code.length; i++) 
            if (code[i] == nameBlock) {
                currentBlock.innerHTML = callback();

                for (var j = 0; j < currentBlock.querySelectorAll('input').length; j++) inputs.push(currentBlock.querySelectorAll('input')[j].getAttribute('name'));

                callback(null, null, inputs);
            }
    }


и его использование:

box('test', {}, function(error, result, page){
        return '<div>Auth</div><br><input name="login" placeholder="Enter login"><br><input name="password" placeholder="Enter password">';
    });


Суть работы такая — мы отправляем HTML код через return обратно в функцию, где она согласно роста вставляется в нужное место на странице. Но нам также нужно в переменную page передавать данные об inputs блока и иметь возможность использовать их результаты в верстке перед отправкой в return. Получается ситуация что не удается получить доступ к inputs пока не вставится код из return (ведь инпуты еще в верстке не присутствуют) и передать их в переменнуюю callback тоже не получается. При получении дсотупа сначала выводится undefined (что логично) а затем уже только отправляются данные inputs которыенельзя прочитать и использовать.

Вопрос — возможно ли как то и получить верстку из return и без проблем сразу получить доступ к page где будут хранится inputs с верстки?
  • Вопрос задан
  • 152 просмотра
Подписаться 1 Простой 7 комментариев
Пригласить эксперта
Ответы на вопрос 1
@alexalexes
Вот в таких ситуациях я понимаю, зачем придумали VueJS )).
Если серьезно, то чтобы решить задачу в рамках существующего стека, то где-то тут нужно прервать поток выполнения JS функцией setTimeout с нулевым временем ожидания, и продолжить работать с инпутами внутри вызываемой функции setTimeout. Это позволит передать управление браузеру, чтобы он успел отрисовать то, что закинуто в DOM через innerHTML:
if (code[i] == nameBlock) {
                currentBlock.innerHTML = callback();
                setTimeout(function(currentBlock, inputs)
     {
  
for (var j = 0; j < currentBlock.querySelectorAll('input').length; j++) inputs.push(currentBlock.querySelectorAll('input')[j].getAttribute('name'));

                callback(null, null, inputs);
}, 0, // нулевое время setTimeout
currentBlock, inputs // проверьте, чтобы правильно передавались аргументы внутрь setTimeout
);
        break; // тут, наверное, можно прерывать внешний цикл, раз нашли нужное
            }
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы