Я использую базовый класс для некоторых компонентов. Однако при использовании redux я получаю проблему с подключением. Это происходит только при попытке использовать соединение с базовым классом 'DockerWindow'. Если я использую его только на ребенке «DockChat» он работает. Как я могу получить доступ к 'магазину' на 'DockerWindow' (базовый класс)?React es6 расширяет класс, проблема с реакцией-редукцией
DockerWindow
-> DockChat
-> DockOnline
Ошибка:
react-redux
connect.js?243b:129Uncaught TypeError: Cannot read property 'store' of undefined
Пакеты: Реагировать 15.0.2, React-Redux 4.4.5, Redux 3.5.2
// index.js
import React from 'react'
import { render } from 'react-dom'
import { Provider } from 'react-redux'
import configureStore from './store/configureStore'
import Docker from './containers/Docker.js'
import './styles/docker.scss';
var dockerElement = document.querySelector('Docker');
var sessionKey = dockerElement.dataset.sessionKey || '';
var version = dockerElement.dataset.version || '0.0.1';
const store = configureStore({},version);
render(
<Provider store={store}>
<Docker session={sessionKey} />
</Provider>,
dockerElement
);
// configureStore.js
import { createStore, applyMiddleware, combineReducers, compose } from 'redux';
import * as storage from 'redux-storage'
import createEngine from 'redux-storage-engine-localstorage';
import rootReducer from '../reducers';
import {mapDispatchToProps} from '../actions';
export default function configureStore(initialState,version) {
const reducer = storage.reducer(combineReducers(rootReducer));
const engine = createEngine('mytest');
const middleware = storage.createMiddleware(engine);
let store = createStore(reducer,initialState, compose(applyMiddleware(middleware)));
const load = storage.createLoader(engine);
return store;
}
// actions
export const APP_UPDATE_VERSION = 'APP_UPDATE_VERSION';
export function appUpdateVersion(version) {
return {
type: APP_UPDATE_VERSION,
version: version
}
}
export function mapDispatchToProps(dispatch) {
return {
appUpdateVersion: (version) => { dispatch(appUpdateVersion(version)); }
};
}
// reducers.
import {
APP_UPDATE_VERSION } from '../actions'
const initialStateApp = {
version:"0.0.1"
};
export function app(state = initialStateApp, action) {
switch (action.type) {
case APP_UPDATE_VERSION:
// Somehow clear engine/all states
return state;
default:
return state;
}
}
const rootReducer = {
app
};
export default rootReducer;
export function mapStateToProps(state) {
return {
app: state.app
}
}
// DockerWindow.js
import React, { Component, PropTypes } from 'react'
import { connect } from 'react-redux'
import { mapDispatchToProps } from '../actions'
import { mapStateToProps } from '../reducers'
class DockerWindow extends React.Component {
constructor(props) {
super(props);
}
render(body) {
return <div>{body}</div>
}
}
export default connect(mapStateToProps,mapDispatchToProps)(DockerWindow);
// DockOnline.js
import React, { Component, PropTypes } from 'react'
import { connect } from 'react-redux'
import { mapDispatchToProps } from '../actions'
import { mapStateToProps } from '../reducers'
import DockerWindow from './DockerWindow';
class DockOnline extends DockerWindow {
constructor(props) {
super(props);
}
render(){
return super.render(<div>child</div>)
}
}
export default connect(mapStateToProps,mapDispatchToProps)(DockOnline);