Реагировать: передать контекст динамически загружаемому компоненту - PullRequest
0 голосов
/ 05 марта 2019

У меня есть компонент, который загружается динамически, что-то вроде этого:

LoadScript("path/to/component.bundle.js", () => {
    let comp = getComp()
    ReactDOM.render(<Provider store={store}>
           {comp}
    </Provider>, container)
})

и в component.js:

export function getComp() {
    return <MyComponent />
}

Однако MyComponent не имеетдоступ к магазину (который работает, если не загружен динамически).Если я изменю его на:

export function getComp() {
    return <Provider store={store}><MyComponent /></Provider>
}

, тогда он будет работать, но магазин, похоже, не будет связан (например, если было 2 активных магазина).Хранилище создается с помощью createStore из'act-redux '.

Может кто-нибудь сказать, почему MyComponent неправильно получает контекст хранилища / провайдера?Спасибо!

ОБНОВЛЕНИЕ:

Я считаю, что проблема в том, что я использую разделение кода, и загрузка обоих пакетов не работает.

В моем webpack.config.js у меня есть:

entry: {
    admin: './js/index.admin.js',
    kiosk: './js/index.kiosk.js'
},
output: {
    filename: '[name].bundle.js',
    path: path.resolve(__dirname, 'dist'),
    libraryTarget: 'window',
},
optimization: {
    splitChunks: {
        chunks: 'all',
        maxInitialRequests: 2
    }
}

Затем из 'admin' я пытаюсь загрузить комплект 'киоска'.Это создает 2 магазина.Это имеет смысл, поскольку в обоих индексных файлах пакетов в верхней части есть следующее:

import store from './store'

и store.js определяется как:

...
export default createStore(reducer, middleware)

С редукторами проблем нет, так как онивсе включено в обе связки.Обратите внимание, что это не SPA, а устаревшее приложение, в React которого есть некоторые компоненты.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...