У меня есть электронное приложение, основанное на electron-react-boilerplate
.
Теперь, когда у меня запущено одно окно, так как я хотел, чтобы оно запускалось, я начал создавать новое окно.
Iв настоящее время есть 2 html-файла - по одному на каждое окно - содержащие корни div:
<div data-root id="main_root"></div>
<div data-root id="second_root"></div>
My index.js
fileто есть ответ для отрисовки приложения реакции выглядит следующим образом:
import React from 'react';
import { render } from 'react-dom';
import { AppContainer } from 'react-hot-loader';
import HomeRoot from './roots/HomeRoot';
import HoverRoot from './roots/HoverRoot';
import { configureStore, history } from './store/configureStore';
const store = configureStore();
const rootMapping = {
main_root: {
name: 'HomeRoot',
Component: HomeRoot,
getNextRoot: () => require('./roots/HomeRoot'),
},
second_root: {
name: 'SecondRoot',
Component: SecondRoot,
getNextRoot: () => require('./roots/SecondRoot'),
},
};
const renderDesiredRoot = () => {
const rootElementID = document.querySelector('[data-root]').id;
const root = rootMapping[rootElementID];
if (!root) throw Error('There is no such Root component!');
const { Component, getNextRoot, name } = root;
render(
<AppContainer>
<Component store={store} history={history} />
</AppContainer>,
document.getElementById(rootElementID),
);
if (module.hot) {
module.hot.accept(`./roots/${name}`, () => {
const NextRoot = getNextRoot();
render(
<AppContainer>
<NextRoot store={store} history={history} />
</AppContainer>,
document.getElementById(rootElementID),
);
});
}
};
renderDesiredRoot();
Что он делает, он проверяет, какой div root доступен, и отображает правильные компоненты.
Моя проблема
Как создать хранилище, которое будет совместно использоваться экземплярами BrowserWindow?Я уже изучил пакеты по 2 npm (electron-redux
и redux-electron-store
), и они не кажутся мне решением в этом случае.