電子，暴露變化的全局變量到外部模塊

我開發了一個電子應用程序cytoscape.js圖分析。目前，我正在重構代碼庫並將功能轉移到外部模塊。目前我正在與可變範圍作鬥爭。電子，暴露變化的全局變量到外部模塊

我有一些變量，當用戶與圖形交互時發生變化。
我根據分析的類型加載不同的UI（按鈕）。

問題：我無法以簡化代碼的方式將最近的變量值傳遞給模塊。

以下代碼顯示了核心問題。

// app.js 

// require the module 
const printValue = require('./printValue.js') 

// global variable that I want to access 
let selectedNode = '' 

// called when a user clicks on node on the graph 
cytoscape.on('tap', 'node', selection => { 
    // stores the node's data 
    selectedNode = selection.target[0] 

    // I wan't to avoid that, since I load different configurations 
    printValue(selectedNode) // prints the most recent value 
}) 


// loads the different buttons 
if (configuration === '1') { 
    // I want to transfer it to an external module 
    const button = document.getElementById('button-id') 
    button.addEventListener('click',() => { 
    console.log(selectedNode) // prints the most recent value 
    }) 

    // I want to make this part work 
    printValue(selectedNode) // prints '', the initial value of the variable 
} else if (configuration === '2') { 
    // loads different buttons with different functions 
}

該模塊具有以下代碼

// module.js 

    module.exports = function printValue (value) { 
    const button = document.getElementById('button-id') 
    button.addEventListener('click',() => { 
     console.log(value) 
    }) 
    }

我想要做的，是將每個配置的按鈕聲明和相關的功能模塊。然後根據用戶選擇的應用程序配置調用這些模塊。

來源

2017-07-04 or3stis

'selectedNode'似乎是一個基本類型（字符串），所以當你把它傳遞給你的模塊，它會用它了此刻的價值。你可以改變'let selectedNode = {}'，然後通過'selectedNode.value = selection.target [0]'改變值，通過'printValue（selectedNode）'傳遞它並在你的模塊中使用'selectedNode.value'以獲得實際的當前價值。（關鍵字：按值傳遞和按引用傳遞）您每次調用'printValue'時都會向該按鈕添加一個偵聽器，一段時間後，如果單擊一個按鈕，最終會顯示多個console.log 。 – RoyalBingBong

對於他的有用評論和參考值傳遞，積分爲Royalbingbong。

這是非常有幫助的link其中的主題詳細解釋。

這裏是更新的（工作）代碼示例。

selectedNode被聲明爲字符串（原始類型），所以它無法將更新後的值傳遞給模塊。 selectedNode已更改爲一個對象，並且變量值與output鍵一起存儲。將selected value傳遞給printValue函數，在那裏我們打印output密鑰的值。

// app.js 

// require the module 
const printValue = require('./printValue.js') 

// global variable that I want to access 
let selectedNode = {} 

// called when a user clicks on node on the graph 
cytoscape.on('tap', 'node', selection => { 
    // stores the node's data 
    selectedNode.output = selection.target[0] // this is the important bit 
}) 

if (configuration === '1') { 
    // now works 
    printValue(selectedNode) // prints the updated variable 
} else if (configuration === '2') { 
    // loads different buttons with different functions 
}

模塊改爲

// module.js 

module.exports = function printValue (selectedNode) { 
    const button = document.getElementById('button-id') 
    button.addEventListener('click',() => { 
    console.log(selectedNode.output) // the other important bit 
    }) 
}

來源

2017-07-04 23:21:20 or3stis

電子，暴露變化的全局變量到外部模塊

回答

相關問題