JavaScript запросы
Бывают случаи, когда вы хотите организовать операции, например, после запуска двух запросов вы хотите объединить и сохранить их результаты во временном состоянии, а затем открыть модальный. Этот процесс может быть сложным при объединении нескольких обработчиков событий в цепочку и, конечно же, не может быть выполнен в одной строке кода в {{ }}. Именно здесь в игру вступает JavaScript (JS) запрос. Он позволяет взаимодействовать с компонентами и запросами путем написания сложных JS-запросов для выполнения следующих операций:
Взаимодействие с компонентами пользовательского интерфейса
Запускающие запросы
Доступ к сторонним библиотекам JS
Настройка функций
Следующий пример предназначен для того, чтобы вы быстро поняли, что такое JS-запрос и как он работает.
Используйте JS-запрос для объединения результатов запроса
SQL-запрос query1 читает id, first_name, last_name и tid поля из таблицы players в базе данных PostgreSQL.
select id, first_name, last_name, tid from playersSQL-запрос query2 читает tid, city и name поля из таблицы teams в базе данных PostgreSQL.
select tid, city, name from teamsИспользуйте JS-запрос для левого соединения query1 и query2 на том же самом tid в следующих шагах.
Создайте
query3и выберите Запустить JavaScript-код.Вставьте следующий код.
return Promise.all([query1.run(), query2.run()]).then( data => join(data[0], data[1]), error => {} ); function join(players, teams) { return players.map(player => { const team = teams.find(t => player.tid === t.tid); return { ...player, ...team }; }); }В этом фрагменте кода
Promise.all()способ получает результатыquery1иquery2, иjoin()метод объединяет их результаты после успешного запуска на основе значенийtidполе.\
Возвращение данных
Воспользуйтесь return синтаксис для возврата результата. Например, следующий код возвращает 3.
return Math.floor(3.4)Возвращаемый результат также может быть объектом Promise. Например, query2.run() возвращает объект Promise.
return query2.run()Доступ к данным
Используйте JS-запросы для доступа к данным в вашем приложении. Обратите внимание, что нет необходимости использовать {{ }} обозначение.
var data = [input1.value, query1.data, fileUpload.files[0].name];Управляющий компонент
В JS-запросах вы можете использовать методы, предоставляемые компонентами, для взаимодействия с компонентами пользовательского интерфейса в вашем приложении. Такая операция не поддерживается встроенным JS-кодом в {{}}.
// установите значение параметра input1 равным Hello.
input1.setValue("Hello");Метод input 1.setValue() (или другие методы компонента) является асинхронным и возвращает объект Promise. Обращение к input1.value сразу после установки значения input1 не возвращает обновленное значение.
Выполнение запроса
run() метод и обратные вызовы
run() метод и обратные вызовыВызов run() метод для выполнения других запросов, например:
return queryByName.run(); // запустите запрос, и он вернет обещаниеВозвращаемое значение query.run() это обещание, поэтому вы можете прикрепить обратные вызовы для обработки успешного результата или ошибки.
return queryByName.run().then(
data => { // после успешного выполнения запроса
return "hello, " + data.user_fullname;
},
error => { // после неудачного выполнения запроса
// используйте встроенную функцию сообщения, чтобы вывести сообщение об ошибке
message.error("An error occured when fetching user: " + error.message);
}
);Передача параметров
Вы можете передать параметры в методе run(), чтобы отделить реализацию запроса от его параметров.
query.run({
param1: value1,
param2: value2
...
});Например, в SQL-запросе query1, вы можете определить name и status как параметры, которые необходимо передать для его выполнения.
select * from users
where
user_name = {{ name }}
and
user_status = {{ status }}Затем вы можете передать соответствующие параметры в query1.
query1.run({
name: "Bob",
status: 0
}).then(
data => { // после успешного выполнения запроса 1
console.log("The result is" + JSON.stringify(data));
},
error => { // после неудачного выполнения запроса 1
console.log("An error occured," + error.message);
}
);Демо 1
Когда у вас есть несколько входных данных в приложении, запускающих один и тот же запрос, передача параметров этому запросу позволяет вам повторно использовать его в любом месте.
-- запрос1:
select id, name, gender, address from users where id={{numberInput1.value}}
-- запрос2:
select id, name, gender, address from users where id={{table1.selectedRow.id}}
-- запрос3:
select id, name, gender, address from users where id={{select1.value}}
...При обновлении реализаций SQL может возникнуть путаница, поскольку необходимо тщательно проверять и обновлять все повторяющиеся запросы. Теперь вы можете избавиться от повторяющегося SQL, введя параметры запроса.
-- просто напишите SQL один раз и извлеките его параметр {{id}}:
select id, name, gender, address from users where id= {{id}}Затем запустите этот запрос в Run JavaScript обработчиков событий в каждом из входных данных.
Последовательное выполенение запросов
Бывают случаи, когда нужно последовательно выполнить несколько запросов. Чтобы это сделать нужно сначала подготовить все необходимые запросы в приложении. И затем добавить блок JavaScript
// последовательное выполнение запросов
async function runTasks() {
try {
await query1.run();
await postgresUpdate.run();
await queryGet.run();
} catch (err) {
console.error("Error:", err);
}
}
runTasks();Объявить функцию
Вы можете объявлять функции внутри JS-запроса для лучшей читабельности.
// Является ли первое число кратным второму числу
function isMultiple(num1, num2) {
return num1 % num2 === 0;
}
// Вызовите библиотеку моментов, чтобы вернуть текущую дату
function getCurrentDate() {
return moment().format("YYYY-MM-DD");
}Добавление предварительно загруженных скриптов
Apeekflow поддерживает импорт сторонних JS-библиотек и добавление предопределенного JS-кода, например, добавление глобальных методов или переменных для повторного использования на уровне приложения или рабочей области. Настройки на уровне приложения можно найти в разделе ⚙️ > Другие > Скрипты и стиль.
Для настройки на уровне рабочей области перейдите в раздел Настройки > Дополнительно.
На вкладке JavaScript вы можете добавить предварительно загруженный код JavaScript для определения глобальных методов и переменных, а затем повторно использовать их в своем приложении. Информацию об импорте библиотек смотрите в разделе .
Ограничения
По соображениям безопасности в Apeekflow отключены несколько глобальных переменных и функций window. Пожалуйста, сообщайте в Telegram, если у вас возникнут какие-либо проблемы.
Last updated