Реагируйте, как повторно смонтировать компонент после изменения маршрута

Question

Я использую реаги-редукс в своем проекте.

У меня есть какой-то компонент, в который я отправляю какое-то действие и получаю данные из редуктора в компонент на componentWillMount метод здесь, проблема, когда я перехожу на метод componentWillMount для маршрутизации, не запускающий мои действия или что-то ещеостальное.для этого мне нужно обновить страницу.

вот мой componentWillMount Метод:

 componentWillMount() {

        console.log("d")
        this
            .props
            .getChartData()
        data = this.props.chartData
    }

и вот мой main.js , куда я импортирую свои компоненты и назначаю маршрутизацию.

import CompA from 'components/CompA'
import CompB from 'components/CompB'



const App = () => (
    <Container fluid>
        <div>
          <main>
            <Switch>
              <Route exact path="/page-a" component={ComponentA} />
              <Route exact path="/page-b" component={ComponentB} />
            </Switch>
          </main>
        </div>
    </Container>      
)

export default App

где я ошибаюсь или что мне с этим делать?

и index.js:

const target = document.querySelector('#root')

console.log(store.getState())
render(
  <Provider store={store}>
    <ConnectedRouter history={history}>
      <div className="row">
        <App />
      </div>
    </ConnectedRouter>
  </Provider>,
  target
)

Answer 1

Я думаю, что вы используете ConnectedRouter из пакета response-router-redux, который сейчас устарел.

Для реакции-маршрутизатора 4 вам нужно использовать withRouter реагировать-маршрутизатор-дом, чтобы обернуть компонент перед его подключением следующим образом: withRouter(connect(...)(MyComponent)) Вы также можете получить совпадение, местоположение, свойства истории через реквизит после того, как компонент обернут в withRouter.

Для получения дополнительной информации о withRouter, вы можете посетить следующую ссылку: https://reacttraining.com/react-router/web/api/withRouter

Answer 2

если вы используете redux, вы должны использовать mapStateToProps для изменения состояния в вашем компоненте