我试图让它在从服务器接收数据后,自动更新组件。查到connect()函数的信息,redux-logger显示reducer在工作,redux-devtools显示store正在更新,但是组件的props没有变化,分别是组件没有重绘。如何正确订阅组件以存储更改。
我这样创建存储库:
import {applyMiddleware, createStore} from "redux";
import {logger} from "redux-logger";
import thunk from "redux-thunk";
import promise from "redux-promise-middleware";
import reducers from "./reducers/combineReducer";
const middlewares = applyMiddleware(promise, thunk, logger);
export default createStore(reducers, middlewares);
应用:
import React from "react";
import ReactDOM from "react-dom";
import {Provider} from "react-redux";
import { BrowserRouter, Route, Switch } from 'react-router-dom';
import store from "../store";
//import ...
ReactDOM.render (
<Provider store={store}>
<BrowserRouter>
<Switch>
<Route path="/" component={Layout} />
// прочие страницы
</Switch>
</BrowserRouter>
</Provider>, document.querySelector ("#root"));
实际组件:
import React from "react";
import { connect } from 'react-redux';
class Layout extends React.Component {
render() {
return (
<div className="container">
// разметка
</div>
);
}
}
function mapStateToProps(state) {
return {
data: state.data,
page: state.page,
fetching: state.fetching,
fetched: state.fetched,
error: state.error,
};
}
export default connect(mapStateToProps)(Layout);