Далее. js: кнопка «Назад» не вызывает getInitialProps - PullRequest
Новая
       8

Далее. js: кнопка «Назад» не вызывает getInitialProps

0 голосов
/ 06 января 2020

У меня есть страница поиска, которая основана на фильтрах. Если какой-либо фильтр выбран, я просто помещаю его sh в URL, а затем устанавливаю свое выбранное состояние и пытаюсь получить результаты на основе выбранного состояния.

Проблема: getInitialProps не вызывается при возвращении истории кнопка, поэтому я не могу установить выбранное состояние на основе параметров запроса.

Я думал, что проблема может возникнуть из-за мелкой маршрутизации, поэтому я установил shallow: false затем выбранное состояние меняется, и он переходит в бесконечное l oop. Не почему измененное состояние изменяется, когда я установил shallow: false .

Пожалуйста, помогите мне узнать, как вызвать getInitialProps для кнопки возврата истории, чтобы я мог установить выбранное состояние.

Вот мой код: 

const SearchPage = ({
  dispatch,
  selected,
  filters
}: {
  dispatch: any;
  selected: TypeSelected;
  filters: TypeFilter;
}): JSX.Element => {
  const classes = useStyles();

  React.useEffect(() => {
    const query: any = {};
    if (selected.party && selected.party.length > 0)
      query.party = selected.party;
    if (selected.state && selected.state.length > 0)
      query.state = selected.state;
    const as = url.format({
      pathname: '/search',
      query: query
    });
    Router.push('/search', as, { shallow: true });

    dispatch(getSearchPageResults(query));
  }, [selected]);
  return (
      // filters get selected here
  );
};

SearchPage.getInitialProps = async ({ store, query }: any): Promise<void> => {
  if (
    store.getState().filters.state.length > 0 &&
    store.getState().filters.party.length > 0
  ) {
    await store.dispatch(selectedActions.setAll(query));
  } else {
    await store.dispatch(searchPageInitial(query));
  }
};

const mapStateToProps = (
  state: AppState
): {
  selected: TypeSelected;
  filters: TypeFilter;
} => ({
  filters: state.filters,
  selected: state.selected
});

export default connect(mapStateToProps)(SearchPage);

Заранее спасибо.

...