如何在多个文件之间共享全局变量?

IT技术 javascript node.js reactjs ecmascript-6
2021-05-11 16:47:44

我有两个文件都需要一个全局变量。我有一个点击按钮。当它被点击时,运行一个函数。代码如下所示:

文件 1:

var globalVar = '', // The global variable

<button onClick = {() => this.edit(arg1)}></button>
function edit (arg1){

   globalVar = arg1;
}

module.exports = globalVar;

我有另一个文件,看起来像这样:

文件2:

var globalVar = require(./file1);

function openModal(){

if (globarVar != ''){
 do something

} }

问题是,当我单击按钮时,在 edit() 函数中更新 globalVar,但我在 file2 中的 console.log(globalVar) 显示“”。我的问题是当我单击时如何将 globalVar 传递给 file2按钮?

1个回答

如果你真的想要一个全局变量(当然不建议)那么你总是 100% 自由地做

window.globalVar = 0;

在您的任何module中。


更强大的解决方案当然是让这个全局变量位于某种专用module中,比如

全局变量

export default {
    value: 0
};

然后你可以

import globalVal from './globalVar';

globalVal.value = 'whatever';

从任何需要的module。

唯一的风险是,如果您进行代码拆分,webpack 可能会将这个相同的“全局”值复制到多个包中,具体取决于您的设置。所以单独的module将使用他们自己的这个非全局变量的本地副本。编辑- 这不是真的。webpack 从来没有这样做过;该评论是基于我的误解。