如何从独立JavaScript(.js)文件访问QML Singleton单例

你在JS文件中通过.import导入的是单例所属的模块命名空间，不是单例实例本身，所以直接访问TC.myWidth会返回undefined。QML文件中导入模块后，QML引擎会自动将单例实例注入到当前作用域，所以可以直接访问TrConfig.myWidth，但JS文件的导入逻辑没有这个自动注入特性。

直接修改myjslib.js的属性访问写法，从模块命名空间下取单例实例再访问属性：

// myjslib.js
.import QtQml 2.11 as QtQml
.import TrConfig as TC

// 可选：提前绑定单例别名，后续直接用TrConfig访问
const TrConfig = TC.TrConfig

function myfunc() {
  // 写法1：直接从命名空间下访问
  console.log("In myjslib.js myWidth is " + TC.TrConfig.myWidth); 
  // 写法2：用提前绑定的别名访问
  console.log("In myjslib.js myWidth is " + TrConfig.myWidth); 
}

修改后运行即可正常输出234。

如果不想修改JS文件的导入逻辑，也可以在QML调用JS函数时，把单例实例当参数传入：

// myjslib.js
function myfunc(TrConfig) {
  console.log("In myjslib.js myWidth is " + TrConfig.myWidth); 
}

QML侧调用时传参：

Component.onCompleted: {
    console.log("Foo onCompleted: myWidth="+TrConfig.myWidth);
    J.myfunc(TrConfig); // 传入单例实例
}

内容的提问来源于stack exchange，提问作者jimav