qml 引入js_GrayCatYa

JavaScript资源可以被QML文档和其他JavaScript资源导入，可以通过相对或者绝对路径进行导入。如果使用相对路径，则位置解析需要相对于包含import语句的QML文档或JavaScript资源的位置。如果JavaScript需要从网络资源中进行获取，则组件的status属性会被设置为“Loading”，直到该脚本被下载完成。

JavaScript资源也可以导入QML模块和其他的JavaScript资源。在JavaScript资源中的import语句的语法和QML文档中的import语句的语法略有不同，下面的内容中会详细讲解。可以在帮助中索引Importing JavaScript Resources in QML关键字查看本节内容。

在QML文档中导入JavaScript资源

在QML文档中可以使用如下语法来导入一个JavaScript资源：

import “ResourceURL” as Qualifier

例如：

import "jsfile.js" as Logic

导入JavaScript资源总是使用”as” 关键字进行限定的。每个JavaScript资源的限定符必须是唯一的，所以限定符和JavaScript文件总是一对一的映射。在被导入的JavaScript文件中定义的函数可以被QML文档中定义的对象调用，这需要使用Qualifier，functionName(params)语法。JavaScript资源中的函数可以包含参数，参数类型可以是QML基本类型或对象类型也可以使用常规的JavaScript类型。当在QML中调用这些函数时，数据类型转换规则(可以在帮助中索引Data Type Conversion Between QML and C++关键字)会应用到参数上并返回结果。

在JavaScript资源中进行导入

从Qt Quick 2.0 开始，JavaScript资源可以使用标准的QML导入语法来导入其他JavaScript资源和QML类型命名空间。不过还会受到下面这些额外的语义限制:

包含导入的脚本不会从导入了该脚本的QML文档中继承导入(如无法访问Component.errorString);

没有包含导入的脚本可以从导入了该脚本的QML文档中继承导入(如可以访问Component.errorString);

一个共享脚本(如定义为.prama库)不能从任何QML文档中继承导入。

第一个语义概念上是正确的，这样一个特定的脚本会被多个QML文件导入；第二个语义的保留是为了向后兼容；第三条语义于当前的共享脚本的语义是一致的，这里只是为了对可能出现的新情况(在脚本中导入其他脚本或模块)进行澄清。

JavaScript资源可以使用下面的方式来导入其他资源：

. import "filename.js" as Qualifier

例如：

. import "factorial.js" as MathFunctions

JavaScript资源可以使用下面的方式来导入一个QML模块：

. import TypeNamespace MajorVersion.MinorVersion as Qualifier

例如：

. import Qt.test 1.0 as JsQtTest

包含一个JavaScript资源

当导入一个JavaScript文件时，必须使用限定符，这样在这个JavaScript文件中的函数就可以被导入该文件的脚本通过限定符进行访问了。有时希望不使用限定符就可以导入这些函数并直接使用，这时可以使用Qt.include()函数来包含一个JavaScript文件。这样会复制被包含文件中所有的函数到当前文件的命名空间，但是会忽略所有的参数和定义在文件中的导入。例如下面的代码中的主文件里调用了script.js中的showCalculations(),而在script.js中调用了factorial.js中的factorial(),因为script.js中使用Qt.inculude() 包含了factorial.js文件。

//myjs.qml

import QtQuick 2.9

import "script.js" 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.js

Qt.include("factorial.js")

function showCalculations(value) {

console.log("Call factorial() from script.js:", factorial(value));

}// factorial.js

function factorial(a) {

a = parseInt(a);

if(a <= 0)

{

return 1;

} else {

return a * factorial(a - 1);

}

}

注意：调用Qt.include()会复制factorial.js中所有的函数到MyScript命名空间，这就意味着QML组件中也可以直接通过MyScript.factorial()来访问factorial()函数。