Требуется обсуждение динамических маршрутов с мелким вариантом следующего JS

Question

Страница отображается каждый раз, когда мы пытаемся обновить или добавить queryParms в URL с мелким параметром. иногда появляется ошибка

Предоставленный as значение (null) несовместимо с href значение (/ поиск /[страна]/[город])

Для динамических маршрутов моя структура папок

Search -> Folder Name
   - [country]
     -  [city].js

когда я пытаюсь обновить URL-адрес при нажатии

  const incrementCounter = () => {
     const currentCounter = query.counter ? parseInt(query.counter) : 0;
    const href = `/search/de/berlin/?counter=${currentCounter + 1}`;
    router.push(pathname, href, { shallow: true });
  };

https://i.stack.imgur.com/s8Xzr.png

В моем случае при щелчке счетчика состояния мой объект запроса в маршрутизаторе не обновляется с помощью счетчика params. so, если я щелкну еще раз, он не увеличивается.

во втором случае, если я заменю имя пути на asPath, мой URL-адрес обновляется, а параметры запроса обновляются. Проблема в том, что страница отображается каждый раз на сервере.

Воспроизводить

Шаги по воспроизведению поведения:

коды и URL-адрес

1. Страница /search/de/berlin
2. Нажмите на изменение счетчика состояния
3. увидеть страницу рендеринга, но не обновить URL
4. Увидеть ошибку

Ожидаемое поведение

Мой текущий URL - http://localhost:4000/search/de/berlin хотите добавить новый queryParams: ?counter=3&id=98

Не следует перезагружать страницу на сервере. должны быть все параметры в запросе маршрутизатора.

Системная информация

• Версия Next.js: Последняя
• Версия Node.js: Последняя