2017-02-09 23 views
9

में संदर्भ मेनू का ढेर मैं एक इलेक्ट्रॉन आधारित अनुप्रयोग का निर्माण कर रहा हूं जिसमें अद्वितीय पंक्तियों वाली ग्रिड शामिल है। मुझे एक संदर्भ-मेनू चाहिए जो प्रत्येक पंक्ति के लिए विशिष्ट है। यहाँ एक उदाहरण है: एकाधिक पंक्तियों देखते हैंइलेक्ट्रॉन

Image of GUI with context menu

हालांकि इस स्क्रीन शॉट काटी है, तो आप देख सकते हैं और प्रत्येक पंक्ति अलग डेटा होता है। चूंकि मैं एक पंक्ति पर राइट-क्लिक करना चाहता हूं और एक अनन्य संदर्भ मेनू प्राप्त करना चाहता हूं, मैंने electron-context-menu लागू किया है, जो पहले दाएं क्लिक पर काम करता है, लेकिन उसके बाद के दाएं-क्लिक संदर्भ मेनू के स्टैकिंग प्रभाव का कारण बनते हैं।

विशेष रूप से, यहाँ क्या होता है:

  1. मैं सही पंक्ति -1 और उचित संदर्भ मेनू पर क्लिक करें
  2. मैं सही पंक्ति -2 पर क्लिक करें पता चलता है और पंक्ति के लिए संदर्भ मेनू की पुनरावृत्ति -1 दिखाता है तो पंक्ति -2 का संदर्भ मेनू दिखाता है। (स्क्रीन शॉट में नोटिस संदर्भ मेनू दिखाता है जो मेरे माउस की पंक्ति से मेल नहीं खाता है)
  3. यह दोहराता है।

React.JS में, यहाँ मेरी श्रोता, के रूप में electron-context-menu मॉड्यूल की जरूरत है जो contextmenu वस्तु एकत्र करता है:

handleContextMenu() { 
    this.props.contextMenu({ 
     window: electron.remote.BrowserWindow.getFocusedWindow(), 
     prepend: (params, browserWindow) => [{ 
     label: `Library Compare ${this.state.msn}`, 
     click:() => this.runLibCompare() 
     }], 
     append: (params, browserWindow) => [{ 
     label: '---', 
     }] 
    }) 
    }; 

कहाँ this.props.contextMenu(...) perculates अप React.JS घटकों में खिलाया जाना चाहिए:

const contextMenu = eRequire('electron-context-menu'); 

मैंने कुछ बड़े पैमाने पर डीबगिंग किया है और मुझे नहीं लगता कि यह समस्या मॉड्यूल है। मैं जिस मॉड्यूल का उपयोग कर रहा हूं वह आवश्यक रूप से संदर्भ मेनू के बारे में जानकारी व्यवस्थित करता है और फिर electron.remote फ़ंक्शन और menu.popup फ़ंक्शन का उपयोग करता है जो इलेक्ट्रॉन आंतरिक से आता है। specific line in github का लिंक यहां दिया गया है।

const menu = (electron.Menu || electron.remote.Menu).buildFromTemplate(menuTpl); 
menu.popup(electron.remote ? electron.remote.getCurrentWindow() : win); 

menu.popup को इस कॉल में इस line in electron की ओर जाता है।

const remoteMemberFunction = function (...args) { 
    if (this && this.constructor === remoteMemberFunction) { 
     // Constructor call. 
     let ret = ipcRenderer.sendSync('ELECTRON_BROWSER_MEMBER_CONSTRUCTOR', metaId, member.name, wrapArgs(args)) 
     return metaToValue(ret) 
    } else { 
     // Call member function. 
     let ret = ipcRenderer.sendSync('ELECTRON_BROWSER_MEMBER_CALL', metaId, member.name, wrapArgs(args)) 
     return metaToValue(ret) 
    } 

}

तो मैं ipcRender.sendSync के लिए एक कॉल देखते हैं - लेकिन जब मैं ipcMain के receiver of those calls में डीबगिंग बयान जोड़ने के लिए, मैं किसी भी उत्पादन नहीं दिख रहा है!

ipcMain.on('ELECTRON_BROWSER_MEMBER_CALL', function (event, id, method, args) { 
    try { 
    args = unwrapArgs(event.sender, args) 
    let obj = objectsRegistry.get(id) 

    if (obj == null) { 
     throwRPCError(`Cannot call function '${method}' on missing remote object ${id}`) 
    } 

    callFunction(event, obj[method], obj, args) 
    } catch (error) { 
    event.returnValue = exceptionToMeta(error) 
    } 
}) 

जब मैंने उपर्युक्त फ़ंक्शन में डीबग कथन जोड़ा, तो मुझे कोई आउटपुट नहीं मिला। और यही वह जगह है जहां मेरी एक दीवार है।

मैं इलेक्ट्रॉन 1.4.15 का उपयोग कर रहा हूं। मुझे पता है कि इस मुद्दे को हल करने योग्य होना चाहिए, सभी एटम आईडीई (जो कि इलेक्ट्रॉन आधारित है) के पास इस समस्या नहीं है, भले ही इसमें एकाधिक संदर्भ मेनू हों।

मुझे लगता है कि मुझे कुछ याद करने की ज़रूरत है, मुझे पता नहीं है कि पिछले संदर्भ मेनू के ढेर को कैसे साफ़ किया जाए!

उत्तर

1

मैं e.target का उपयोग करके क्लिक का लक्ष्य प्राप्त करके इसे हल करता हूं। फिर, उस पर निर्भर करता है, मैं संबंधित संदर्भमेनू को कॉल करता हूं। यदि लक्ष्य ऐप मेरे ऐप के लिए लक्ष्यों की सूची में नहीं है, तो मैं एक डिफ़ॉल्ट contextmenu का उपयोग करता हूं।

window.addEventListener(
    "contextmenu", 
    e => { 
     e.preventDefault(); 
     if (e.target.id === 'fullscr'){ 

     console.log(e && e.target); 

     // e.preventDefault(); 
     mymenu.popup(remote.getCurrentWindow()); 
     }else{ 
      editmenu.popup(remote.getCurrentWindow()); 
     } 
     console.log(e.which); 
    }, 
    false 
); 
संबंधित मुद्दे