Home>

I'm trying to make the component update automatically after receiving data from the server. I found information about the connect () function, redux-logger shows that the reducer is working, redux-devtools shows that the store is being updated, but the props of the component do not change, respectively, the component is not redrawn. How to properly subscribe a component to storage changes.

I create the repository like this:

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);

Appendix:

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} />        //other pages
      </Switch>    </BrowserRouter> </Provider>, document.querySelector("#root"));

The actual component:

import React from "react";
import { connect } from 'react-redux';
class Layout extends React.Component {
  render() {
    return (
      <div className="container">        //markup
      </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);

Well, where is the request function called?

WVFFLIFE2022-02-07 12:45:51

Hung on a button. There, the action is triggered and the logger fixes the work of the reducer, if necessary, I can provide the component code

Nick2022-02-07 12:45:51

yes, update the question and add the code of this component there

WVFFLIFE2022-02-07 13:00:15

Added component markup, and at the same time an action with a reducer.

Nick2022-02-07 13:00:15

fetchSmallData and fetchBigData from where in Layout?

WVFFLIFE2022-02-07 13:00:15