2016-12-15 5 views
1

У меня есть приложение, использующее Electron, React и React Router. Я использую ipcRenderer в конструкторе компонентов для отправки событий из моего компонента в основной процесс Electron. После того, как я добавил React Router в микс, я заметил, что мое ipcRenderer событие добавлялось снова и снова каждый раз, когда я уходил и возвращался к компоненту. Я полагаю, что это потому, что React Router монтирует и размонтирует компонент по мере необходимости.ipcRenderer в конструкторе компонентов React

Я нашел способ обойти эту проблему путем проверки, если событие уже было зарегистрировано, как это:

if (!ipcRenderer._events['open-file-reply']) { 
    ipcRenderer.on('open-file-reply', (event, fileContents) => { 
    if(fileContents){ 
     this.setState({ 
     data: JSON.parse(fileContents) 
     }); 
    } 
    }); 
} 

Я просто интересно, если есть более правильный способ сделать это. ipcRenderer.on в любом случае принадлежит конструктору или есть более подходящее место для его размещения?

EDIT

Это лучшее решение, которое я придумал до сих пор:

import {ipcRenderer} from 'electron'; 

/* inside React component */ 
constructor(props) { 
    super(props); 
    // ... 
    this.loadFileListener = this.loadFileListener.bind(this); 
    ipcRenderer.on('open-file-reply', this.loadFileListener); 
} 

componentWillUnmount() { 
    ipcRenderer.removeAllListeners(['open-file-reply']); 
} 

loadFileListener(event, fileContents) { 
    // set state and stuff... 
} 

ответ

2

Я не думаю, что вы должны быть настройки IPC, пока компонент не установлен, так Я бы предложил такой подход:

constructor(props) { 
    super(props) 
    this._loadFileListener = this._loadFileListener.bind(this) 
} 

componentDidMount() { 
    ipcRenderer.on('open-file-reply', this._loadFileListener) 
} 

componentWillUnmount() { 
    ipcRenderer.removeListener('open-file-reply', this._loadFileListener) 
} 
Смежные вопросы