如何在多個文件之間共享一個全局變量？

我有兩個文件都需要一個全局變量。我有一個點擊按鈕。當它被點擊時，運行一個功能。代碼如下所示：如何在多個文件之間共享一個全局變量？

文件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

} }

問題是當我點擊按鈕時，globalVar在edit（）函數中更新，但是我console.log（globalVar）在file2中顯示''。我的問題是當我點擊按鈕時如何將globalVar傳遞給file2？

來源

2017-09-28 Bo Huang

考慮使用Redux。 – SLaks

它不是全局的，如果它屬於一個文件，順便說一句，爲什麼在編寫es5 commonjs語法時使用'es6'標記？並且在反應中我們使用'道具'在 –

ops周圍傳遞物體。我要把es5標籤。我很抱歉。我是React的新手。因此在React中沒有辦法使用全局變量？ –

如果你真的想要一個全局變量（不可取的，當然），那麼你總是100％免費做

window.globalVar = 0;

您的任何模塊

。

更強大的解決辦法當然是在某種專用模塊的這個全局變量坐，像

globalVar.js

export default { 
    value: 0 
};

，然後你可以

import globalVal from './globalVar'; 

globalVal.value = 'whatever';

來自任何需要的模塊。

唯一的風險是，如果您的代碼分裂，webpack可能會將相同的「全局」值複製到多個包中，具體取決於您的設置。所以單獨的模塊將使用他們自己的本地副本這個不那麼全局變量。

來源

2017-09-28 19:22:08

我試了一下，它的工作！還有一個問題。使用window.globalVar有什麼缺陷？非常感謝！ –

好吧，全局變量往往不易維護，難以跟蹤等。但如果你剛剛開始，嘗試等等，那麼通過一切手段。隨着程序的增長和增長，在對React更熟悉之後，您應該考慮嘗試像MobX或Redux這樣的狀態管理器（但不是之前！）。這些工具爲您的應用程序帶來了複雜性，因此請確保您在進入該路線之前探索React本身並獲得舒適。快樂的編碼！ –

感謝您的建議和耐心！非常感謝！ –

如何在多個文件之間共享一個全局變量？

回答

相關問題