Есть ли способ принудительно обновить компоненты путем изменения URL-адреса с использованием redux и response-router? - PullRequest
0 голосов
/ 08 апреля 2019

Я настраиваю приложение для социальной сети студента.Я использую реагируй, перевожу и реагируй маршрутизаторМой компонент списка каналов хранит идентификатор студента из URL.Когда я использую маршрутизатор React, мой компонент не обновляется.

Я прочитал эту статью https://github.com/ReactTraining/react-router/blob/master/packages/react-router/docs/guides/blocked-updates.md и попытался обернуть свои компоненты в withRouter.

index.js:

ReactDOM.render(
    <Provider store={store}>
        <Router>
            <Route path="/" component={App} />
            <Route exact path="/sign/In" component={SignIn} />
            <Route exact path="/sign/Up" component={SignUp} />
        </Router>
    </Provider>, document.getElementById('root'));

App.js:

class App extends Component {
  render() {
    return (
      <Router id="Page" >
        <div className={this.props.AppStore.Theme}> 
          <header>
            <NavBar />
          </header>
          <Route exact path="/" component={HomePage} />
          <Route exact path="/@:id" component={feedpage} />
        </div>
      </Router>
    );
  }
}
const mapStateToProps = (state) => {
  return state
}
export default withRouter(connect(mapStateToProps)(App));

feedPage.js:

class feedPage extends Component {
  componentDidMount() {
    const {dispatch} = this.props;
    API.requireFeed(this.props.match.params.id,"profil",20)
    .then((res) => {
      if(res){
        dispatch(postList(res));
      }
    })
  }
  render() {
    return (
      <div id="Page">
        <div id="mainPage">
          <div id="centralCard">
            {this.props.postList.map((element) => (
              <div>
                <Link to={'/@'+element.Pseudo}>{element.Pseudo}</Link>
                <p>{element.Content}</p>
              </div>
            ))}
          </div>
        </div>
      </div>
    );
  }
}

const mapStateToProps = (state) => {
  return state
}
export default withRouter(connect(mapStateToProps)(feedPage));

Я ожидаю обновлениякаждого компонента каждый раз, когда я нажимаю на ссылку на другой feedPage.

У кого-то есть идея о том, как решить проблему, мне бы это понравилось:)

1 Ответ

0 голосов
/ 08 апреля 2019

У вас должен быть только один компонент маршрутизатора (в index.js), вложенная маршрутизация в компоненте приложения не требует другого маршрутизатора, просто объявите ваши маршруты.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...