Сначала мне показалось, что это извращение - использовать Реакт, вместо шаблонизатора, как из пушки по воробьям.
Но, в самом использовании по-моему нет ничего особенного - вот тут собрал вам
демку
Вкратце:
- Реакт не будет остлеживать состояние глобальных переменных и перерисовывать компонент при их изменении
- Вместо этого вам нужно воспользоваться lifecycle хуками и, как предлагал коллега выше, внутри этого метода пробросить нужные методы для управления состоянием компонента наружу, хоть в тот же widnow
- Это позволит вам импользовать одни и те же методы как в дочерних компонентах: обработка клика по оверлею или по кнопке в модальном окне, так и во внешних, по отношению к контексту Реакта, DOM элементах, или, возможно, в каких-то еще бибилиотеках, JQuery и прочих
Если использовать мой компонент, то нужно немного изменить ваш код:
...
this.on('showModal', function (data) {
if (!window.modalAttached) {
ReactDOM.render(
<ModalWindow data={data} />,
this.el
)
}
window.toggleModal();
}
...