在回调中设置的Redux存储值

时间:2018-04-30 10:38:50

标签: javascript reactjs asynchronous redux

反应 - redux的新手。我在使用redux store时遇到了问题。

商店的数据是从API加载的。我的代码的流程如下:

app.js:

import React from 'react';
import { Provider } from 'react-redux';
import store from './store';
import Schema from './components/Schema';
import './styles/bootstrap.css';
import './styles/main.css';

export default class App{
constructor(props) {
    super(props);
    this.state = { store: {}};
}
componentWillMount(){
    store(storeObject => {
        this.setState({store: storeObject});
    });
}
render(){
    return <Provider store={ this.state.store }><Schema /></Provider>
 }
}

商品/ index.js:

export default function(next) {
  getInitialState(function(initialState) { 
    store = createStore(Reducers, initialState, compose(applyMiddleware(...middleware), extension)); 
    console.log(store);//returning  correct store value     
    next(store);
  });
};

main.js:

 import React from 'react';
 import { render } from 'react-dom';
 import { AppContainer } from 'react-hot-loader';
 import App from './app.js';
 const dom = document.getElementById('root');
 render(
    <AppContainer>
       <App />
    </AppContainer>,
    dom
  );

它给出了以下错误。

enter image description here

1 个答案:

答案 0 :(得分:0)

我猜store函数是对getStore函数的引用并不返回任何意味着App没有返回任何异常的函数。

由于getStore执行异步操作,您必须执行以下操作:

export default class App extends Component{

    componentWillMount(){
        store(storeObject => {
            this.setState({store: storeObject});
        });
    }

    render(){
       return <Provider store={ this.state.store }><Schema /></Provider>
    }
}