NEXT JS - كيفية إزالة Query Params؟

هل تقصد أنك تريد إزالة ال Query Params عند الضغط على الزر ؟

إذا كان كذلك يمكنك استخدام الدالة router.replace كالتالي

const router = useRouter();

router.replace("/about", undefined, { shallow: true });

الرابط سوف يكون كالتالي فقط

/about

 لاحظ أن ال shallow: true تسمح لك تحديث الرابط بدون تنفيذ دوال ال data fetching 

يمكنك القراءة أكثر عن الموضوع من خلال موقع next تحت عنوان Shallow Routing

السؤال غير واضح بشكل ما, هل تريد تغيير الurl ام تغيير المتغيرات في router.query ?  + ماذا تريد ان تحقق بالظبط حتى أستطيع مساعدتك

يمكنك استخدام history.replaceState لتنفيذ ذلك كالتالي

window.history.replaceState(null, '', '/about')

يمكنك حل المشكلة بالشكل التالي:

push(`${asPath.split('?')[0]}?comp=${id}`);
// أو إذا كنت تريد دالة قابلة لإعادة الاستخدام
function delQuery(asPath) {
  return asPath.split('?')[0]
}
..
..
const {push, asPath} = useRouter()
push(`${delQuery(asPath)}?comp=${id}`);

كما يمكنك استخدام history.replaceState لكن قد :

if (typeof window !== "undefined") { 
  window.history.replaceState(null, '', '/about') 
}