将选项传递到 ES6 模块导入概念真实世界示例
2022-08-30 01:54:37
是否可以将选项传递给 ES6 导入?
你如何翻译这个:
var x = require('module')(someoptions);
到ES6?
是否可以将选项传递给 ES6 导入?
你如何翻译这个:
var x = require('module')(someoptions);
到ES6?
没有办法用单个语句执行此操作,它不允许调用。import
所以你不会直接调用它,但你基本上可以做与commonjs对默认导出相同的操作:
// module.js
export default function(options) {
return {
// actual module
}
}
// main.js
import m from 'module';
var x = m(someoptions);
或者,如果您使用支持 monadic promise 的模块加载器,则可以执行如下操作:
System.import('module').ap(someoptions).then(function(x) {
…
});
使用新的导入
运算符,它可能会成为
const promise = import('module').then(m => m(someoptions));
或
const x = (await import('module'))(someoptions)
但是,您可能不想要动态导入,而是静态导入。
这是我使用ES6的解决方案
这与@Bergi的响应非常一致,这是我在创建需要为声明传递参数的导入时使用的“模板”。这用于我正在编写的同构框架,因此将在浏览器和node中使用转译器.js(我与):class
Babel
Webpack
./我的类.js
export default (Param1, Param2) => class MyClass {
constructor(){
console.log( Param1 );
}
}
./主要.js
import MyClassFactory from './MyClass.js';
let MyClass = MyClassFactory('foo', 'bar');
let myInstance = new MyClass();
以上内容将在控制台中输出foo
编辑
对于一个真实的例子,我用它来传递一个命名空间,用于访问框架中的其他类和实例。因为我们只是创建一个函数并将对象作为参数传递进来,所以我们可以用我们的类声明来使用它,如下所示:
export default (UIFramework) => class MyView extends UIFramework.Type.View {
getModels() {
// ...
UIFramework.Models.getModelsForView( this._models );
// ...
}
}
导入有点复杂,在我的情况下,考虑到它是一个完整的框架,但本质上这就是正在发生的事情:automagical
// ...
getView( viewName ){
//...
const ViewFactory = require(viewFileLoc);
const View = ViewFactory(this);
return new View();
}
// ...
我希望这有帮助!