Qt Quick QML中引用公共方法，延迟执行

发表于 更新于 分类于
Qt Quick QML中引用公共方法，延迟执行

基本示例

公共方法

假如我们的公共方法的路径在js/common_methods.js

1
2
3
4
5
6
7
8
9
10
function objToKeyValueString(obj) {
    var keys = Object.keys(obj);
    var values = keys.map(function (key) { return obj[key]; });
    return keys.map(function (key, index) { return key + "=" + values[index]; }).join("&");
}


function obj2Str(obj) {
    return JSON.stringify(obj);
}

添加到qrc中

1
2
3
4
5
<RCC>
    <qresource prefix="/">
        <file>js/common_methods.js</file>
    </qresource>
</RCC>

QML中使用

添加引用

1
import "js/common_methods.js" as CommonMethods

调用

1
2
3
4
5
6
7
Component.onCompleted: {
  let result = CommonMethods.objToKeyValueString({
    "a": 1,
    "b": 2
  });
  console.log(result);
}

延迟执行

这点和JS语法不一样

1
2
3
4
5
6
7
8
9
10
function delayExecute(delayTime, parent, callback) {
    var timer = Qt.createQmlObject('import QtQuick 2.15; Timer { }', parent);
    timer.interval = delayTime;
    timer.repeat = false;
    timer.triggered.connect(function () {
        callback();
        timer.destroy();
    });
    timer.start();
}

QML中使用

1
2
3
4
5
6
7
8
9
import "js/common_methods.js" as CommonMethods

function onShowToast(msg) {
  console.log("onShowToast:" + msg);
  mPop.open();
  CommonMethods.delayExecute(2000, this, () => {
    mPop.close();
  });
}