Импорт ресурсов JavaScript в QML

Добавлено 11 мая 2022 в 00:41

Ресурсы JavaScript могут быть импортированы документами QML и другими ресурсами JavaScript. Ресурсы JavaScript можно импортировать как по относительным, так и по абсолютным URL. В случае относительного URL местоположение определяется относительно местоположения документа QML или ресурса JavaScript, содержащего импорт. Если файл скрипта недоступен, произойдет ошибка. Если JavaScript необходимо получить из сетевого ресурса, status компонента устанавливается на "Loading" до тех пор, пока скрипт не будет загружен.

Ресурсы JavaScript также могут импортировать модули QML и другие ресурсы JavaScript. Синтаксис инструкции импорта в ресурсе JavaScript немного отличается от инструкции импорта в документе QML, что подробно описано ниже.

Импорт ресурса JavaScript из документа QML

Документ QML может импортировать ресурс JavaScript со следующим синтаксисом:

import "URLресурса" as Квалификатор

Например:

import "jsfile.js" as Logic

Импортированные ресурсы JavaScript всегда уточняются с использованием ключевого слова as. Квалификатор для ресурсов JavaScript должен начинаться с заглавной буквы и должен быть уникальным, поэтому всегда существует однозначное соответствие между квалификаторами и файлами JavaScript (это также означает, что квалификаторы не могут называться так же, как встроенные объекты JavaScript, такие как Date и Math).

Функции, определенные в импортированном файле JavaScript, доступны для объектов, определенных в импортирующем документе QML, через синтаксис Квалификатор.имяФункции(параметры). Функции в ресурсах JavaScript могут принимать параметры, тип которых может быть любым из поддерживаемых базовых типов или типов объектов QML, а также обычными типами JavaScript. При вызове таких функций из QML к параметрам и возвращаемым значениям будут применяться обычные правила преобразования типов данных.

Импорт внутри ресурсов JavaScript

В QtQuick 2.0 была добавлена ​​поддержка, позволяющая ресурсам JavaScript импортировать другие ресурсы JavaScript, а также пространства имен типов QML с использованием варианта стандартного синтаксиса импорта QML (где применяются все ранее описанные правила и ограничения).

Из-за способности ресурса JavaScript импортировать другой скрипт или модуль QML в QtQuick 2.0 определены некоторые дополнительные семантики:

  • скрипт с импортом не будет наследовать импорт из документа QML, который его импортировал (поэтому, например, доступ к Component.errorString завершится ошибкой);
  • скрипт без импорта наследует импорт из документа QML, который его импортировал (например, доступ к Component.errorString будет успешным);
  • общий скрипт (т. е. определенный как .pragma library) не наследует импорт из какого-либо документа QML, даже если он не импортирует другие скрипты или модули.

Первая семантика концептуально верна, учитывая, что конкретный скрипт может быть импортирован любым количеством файлов QML. Вторая семантика сохраняется в целях обратной совместимости. Третья семантика остается неизменной по сравнению с текущей семантикой для общих скриптов, но поясняется здесь в отношении нового возможного случая (где скрипт импортирует другие скрипты или модули).

Импорт ресурса JavaScript из другого ресурса JavaScript

Ресурс JavaScript может импортировать другой ресурс JavaScript следующим образом:

import * as MathFunctions from "factorial.mjs";

Или:

.import "имяфайла.js" as Квалификатор

Первый вариант является стандартным синтаксисом ECMAScript для импорта модулей ECMAScript и работает только внутри модулей ECMAScript, что обозначается расширением файла mjs. Второй вариант является расширением JavaScript, предоставляемым движком QML, и будет работать также с немодулями. Поскольку расширение заменено стандартом ECMAScript, его использование не рекомендуется.

Когда файл JavaScript импортируется таким образом, он импортируется с квалификатором. Затем функции в этом файле доступны из скрипта импорта через квалификатор (то есть как Квалификатор.имяФункции(параметры)).

Иногда желательно, чтобы функции были доступны в контексте импорта без необходимости их уточнения. В этом случае модули ECMAScript и инструкция import JavaScript следует использовать без квалификатора as.

Например, приведенный ниже код QML вызывает showCalculations() в script.mjs, который, в свою очередь, может вызывать factorial() в factorial.mjs, так как он включает factorial.mjs с помощью импорта.

import QtQuick 2.0
import "script.mjs" as MyScript

Item {
    width: 100; height: 100

    MouseArea {
        anchors.fill: parent
        onClicked: {
            MyScript.showCalculations(10)
            console.log("Call factorial() from QML:",
                MyScript.factorial(10))
        }
    }
}
// script.mjs
import { factorial } from "factorial.mjs"
export { factorial }

export function showCalculations(value) {
    console.log(
        "Call factorial() from script.js:",
        factorial(value));
}
// factorial.mjs
export function factorial(a) {
    a = parseInt(a);
    if (a <= 0)
        return 1;
    else
        return a * factorial(a - 1);
}

Функция Qt.include() включает один файл JavaScript из другого без использования модулей ECMAScript и без квалификации импорта. Она делает все функции и переменные из другого файла доступными в пространстве имен текущего файла, но игнорирует все прагмы и импорты, определенные в этом файле. Это не очень хорошая идея, так как вызов функции никогда не должен изменять контекст вызывающего объекта.

Qt.include() устарела, и ее следует избегать. Она будет удалена в будущей версии Qt.

Импорт модуля QML из ресурса JavaScript

Ресурс JavaScript может импортировать модуль QML следующим образом:

.import ПространствоИменТипа МажорнаяВерсия.МинорнаяВерсия as Квалификатор

Ниже вы можете увидеть пример, который также показывает, как использовать типы QML из модуля, импортированного в JavaScript:.

.import Qt.test 1.0 as JsQtTest

var importedEnumValue = JsQtTest.MyQmlObject.EnumValue3

В частности, это может быть полезно для доступа к функциям, предоставляемым через тип-singleton; для получения дополнительной информации смотрите QML_SINGLETON.

Примечание. Синтаксис .import не работает для скриптов, используемых в WorkerScript.

Теги

GUI / Графический интерфейс пользователяJavaScriptQMLQtQtQuickПрограммирование

На сайте работает сервис комментирования DISQUS, который позволяет вам оставлять комментарии на множестве сайтов, имея лишь один аккаунт на Disqus.com.

В случае комментирования в качестве гостя (без регистрации на disqus.com) для публикации комментария требуется время на премодерацию.