import 导入JavaScript资源

• 一、概述
• 二、从QML文档导入JavaScript资源
• 三、JavaScript资源中的导入
• 四、从另一个JavaScript资源中导入JavaScript资源
• 五、从JavaScript资源中导入QML模块

一、概述

JavaScript资源可以通过QML文档和其他JavaScript资源导入。JavaScript资源可以通过相对url导入，也可以通过绝对url导入。对于相对URL，位置是相对于包含导入的QML文档或JavaScript资源的位置进行解析的。如果无法访问脚本文件，就会发生错误。

如果需要从网络资源获取JavaScript，则组件的状态将设置为“Loading”，直到脚本下载完毕。

JavaScript资源也可以导入QML模块和其他JavaScript资源。JavaScript资源中的import语句与QML文档中的import语句的语法稍有不同，下面将详细说明。

二、从QML文档导入JavaScript资源

QML文档可以使用以下语法导入JavaScript资源:

import "ResourceURL" as Qualifier

例如:

import "jsfile.js" as Logic

导入的JavaScript资源总是使用“as”关键字进行限定。JavaScript资源的限定符必须以大写字母开头，并且必须是唯一的，因此限定符和JavaScript文件之间总是一对一的映射。(这也意味着限定符不能和内置的JavaScript对象命名一样，比如Date和Math)。

通过“Qualifier.functionName(params)”语法，在导入的JavaScript文件中定义的函数可用于导入的QML文档中定义的对象。

JavaScript资源中的函数可以接受参数，其类型可以是任何支持的QML基本类型或对象类型，也可以是普通的JavaScript类型。当从QML调用此类函数时，正常的数据类型转换规则将应用于参数和返回值。

三、JavaScript资源中的导入

在QtQuick 2.0中，已经添加了支持，允许JavaScript资源导入其他JavaScript资源，也允许使用标准QML导入语法的变体导入QML类型命名空间(其中应用了之前描述的所有规则和资格)。

由于在QtQuick 2.0中，JavaScript资源可以以这种方式导入另一个脚本或QML模块，因此定义了一些额外的语义:

• 带有imports的脚本不会从导入它的QML文档继承imports(因此访问组件。例如，errorString将失败)
• 没有导入的脚本将从导入它的QML文档继承导入(因此访问组件。例如，errorString会成功)
• 共享脚本(即定义为 .pragma库)不会从任何QML文档继承导入，即使它没有导入其他脚本或模块

第一个语义在概念上是正确的，因为特定的脚本可以被任意数量的QML文件导入。保留第二种语义是为了向后兼容。第三种语义与共享脚本的当前语义保持不变，但在这里针对新的可能情况(脚本导入其他脚本或模块)进行了澄清。

第三种就是解决一个js 文件里面的数据应该是同步的问题。用那种写法就能把这个需求给解决掉。

四、从另一个JavaScript资源中导入JavaScript资源

一个JavaScript资源可以像下面这样导入另一个资源:

.import "filename.js" as Qualifier

例如:

import * as MathFunctions from "factorial.mjs";

后者是ECMAScript导入ECMAScript模块的标准语法，只能在由mjs文件扩展名表示的ECMAScript模块中使用。前者是由QML引擎提供的对JavaScript的扩展，也适用于非模块。

当JavaScript文件以这种方式导入时，它是通过一个限定符导入的。然后，在导入脚本中可以通过qualifier(即qualifier . functionname (params))访问该文件中的函数。

有时，我们希望在导入上下文中提供这些函数，而不需要对它们进行限定。在这种情况下，ECMAScript模块和JavaScript import语句不应该使用as限定符。

例如，左边的QML代码在脚本中调用showcalculation()。Mjs，它又可以调用factorial()中的factorial()。Mjs，因为它包含了阶乘。使用import创建MJS。

  import QtQuick 2.0import "script.mjs" as MyScriptItem {width: 100; height: 100MouseArea {anchors.fill: parentonClicked: {MyScript.showCalculations(10)console.log("Call factorial() from QML:",MyScript.factorial(10))}}}

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

Qt.include()函数从一个JavaScript文件中包含另一个JavaScript文件，不使用ECMAScript模块，也不限制导入。它使其他文件中的所有函数和变量都在当前文件的命名空间中可用，但忽略该文件中定义的所有pragmas和import。这不是一个好主意，因为函数调用永远不应该修改调用者的上下文。

Qt.include()已弃用，应避免使用。它将在Qt的未来版本中被移除。

五、从JavaScript资源中导入QML模块

一个JavaScript资源可以像下面这样导入一个QML模块:

.import TypeNamespace MajorVersion.MinorVersion as Qualifier

下面是一个例子，展示了如何从javascript导入的模块中使用QML类型:

.import Qt.test 1.0 as JsQtTestvar importedEnumValue = JsQtTest.MyQmlObject.EnumValue3

特别是，在访问通过单例类型提供的功能时，这可能很有用;请参阅qmlRegisterSingletonType()了解更多信息。

注意：.import语法不适用于WorkerScript中使用的脚本