السلام عليكم لدى مشكلة فى الحصول على الداتا من url next js

عادة، عند استخدام useParams في Next.js للحصول على البيانات من الـ URL، من المحتمل أن تواجه مشكلة ترميز، حيث يتم ترميز الأحرف الخاصة مثل "@" إلى "%40" يمكن استخدام decodeURIComponent لفك ترميز البريد الإلكتروني إلى شكله الصحيح لكن يجب أن تتأكد من أن slug يتم تمريره بشكل صحيح من خلال الـ URL وأنه يحتوي على البريد الإلكتروني المشفر.

لكن توجد طريقة أخرى وهي من خلال استخدام مكتبة query-string التي تسهل التعامل مع الاستعلامات في URL.

أولا، عليك تثبيت المكتبة:

npm install query-string

ثم يمكنك استخدامها كما يلي:

import { useRouter } from 'next/router';
import queryString from 'query-string';
const MyComponent = () => {
  const router = useRouter();
  const { slug } = router.query;

  if (slug) {
    const parsedQuery = queryString.parse(slug.join('/'));
    const email = parsedQuery.email;
    console.log(email);
  }
  return (
    <div>
      {/* باقي الكود */}
    </div>
  );
};
export default MyComponent;

نستخدم هنا queryString.parse لفك ترميز الاستعلامات في URL والحصول على البريد الإلكتروني بشكل صحيح.