Как перерендерить компонент реакт
Всем привет, нужна ваша помощь!
Ситуация следующая. Есть классовые компоненты и store из редакса. В одном из компонентов я обновляю значение в store, а в другом мне это значение необходимо выводить. Проблема в том, что, при обновлении значения, компонент не перерендеривается. Подскажите, пожалуйста, как исправить эту проблему, а также возможно, какие-то другие способы для получения доступа к store внутри классового компонента.
Примечание. Функциональные компоненты использовать нельзя.
Компонент, в котором происходит изменение значения в store.
export class Header extends Component {
constructor(props) {
super(props);
this.state = {
categories: [],
currentCategory: null,
}
}
changeCurrentCategory = (name) => {
this.setState({
currentCategory: name,
})
store.dispatch({type: "CHANGE_CATEGORY", payload: name})
}
Файл редакса.
import {createStore} from "redux";
const initialState = {
currentCategory: "all",
}
const reducer = (state = initialState, {type, payload}) => {
switch (type) {
case "CHANGE_CATEGORY":
return {...state, currentCategory: payload}
default:
return state;
}
}
export const store = createStore(reducer);
Компонент, в котором нужно триггерить изменения.
export class Category extends Component {
constructor(props) {
super(props);
this.state = {
title: store.getState().currentCategory,
}
}
render() {
return (
<div className="category-screen">
<div className="category-screen__container _container">
<h2 className="category-screen__title">{this.state.title}</h2>
<ul className="category-screen__list">