Next.js 如何在NextJS中重定向之前防止页面刷新

所以我有一个NextJS项目，在主页上我有一个按钮，当你点击它时，它会打开一个带有输入字段的模式，在那里你可以搜索一些东西

搜索返回一个项目列表，当我按enter键时，我希望它重定向到列表中的第一个项目

不幸的是，当我点击“回车”时，模式关闭，页面在重定向之前刷新

这是我按下Enter键时运行的方法

    private selectFirstActivityOrSport = () => {
    const { closeSportsSearchModal, sports } = this.props;
    const firstActivityWithSessions = this.state.eventSearchResults.find((activity) => activity.session);

    if (firstActivityWithSessions) {
      this.props.router.push(
        `/${this.locale}/activity/${firstActivityWithSessions.slug}/${firstActivityWithSessions.session[0].id}`
      );
      return;
    }
    if (this.state.sportsResults && this.state.sportsResults.length) {
      const sportId = this.state.sportsResults[0].id;
      const selectedSports = findChildAndParentSportsFromParentId(sportId, sports);
      const sportIds = selectedSports.map((sport) => {
        return sport.id;
      });
      this.selectSport(sportIds);
      helpers.trackSearchSportClickEvent(selectedSports);
      closeSportsSearchModal && closeSportsSearchModal();
    }
  };

这是我的

组件

<SearchInput
  onChange={this.handleSearchChanged}
  onKeyPress={this.selectFirstActivityOrSport}
  value={description}
  placeholder={t("locationSearch.searchBar.placeholder")}
/>

这就是输入

    <input
      type="text"
      ref={inputRef}
      placeholder={placeholder}
      onChange={onChange}
      onKeyPress={setSelectionOnEnterKeyPress}
      value={value}
    />

我已经尝试了几乎所有的方法，不明白为什么接下来要在重定向之前刷新主页

我知道是路由器导致了刷新，因为如果我对router.push（）和console.log（）进行注释，就不会有刷新

有没有人经历过这个问题

多谢各位

    <input
      type="text"
      ref={inputRef}
      placeholder={placeholder}
      onChange={onChange}
      onKeyPress={setSelectionOnEnterKeyPress}
      value={value}
    />