اذهب إلى المحتوى
  • 0

توجيه مخصص مع nextjs؟

عبد النور محمد

السؤال

لدي مكون يتحقق من اسم المسار ويعمل عليه:

 const router = useRouter();
  const path = router.pathname;//props.location.pathname;

  const p = path.split('/').filter((s) => s !== "")
  let submissionId = p[0] == 's' && p[1]
  const submission = useQuery(SUBMISSION, {
    variables: {
      id: submissionId
    },
    skip: submissionId === false
  })

يعمل هذا بشكل جيد في تطبيق react ولكن nextjs يعيد التوجيه إلى 404. هل هناك طريقة لإعداد نمط لـ nextjs لتجاهل المسارات غير الموجودة والسماح لرمز المكون بمعالجته؟

رابط هذا التعليق
شارك على الشبكات الإجتماعية

Recommended Posts

  • 0

يجب أن يكون لديك صفحة محددة في مجلد الصفحات إذا كنت لا تريد أن يقوم Next.js بإعادة التوجيه إلى 404, أنشئ ملف باسم dynamic.js في مجلد الصفحات ثم يمكنك استخدام الكود كالتالي

import React from 'react'
import { useRouter } from 'next/router'

const Dynamic = () => {
  const router = useRouter();
  const { dynamic } = router.query;

  return (
    <div>
      My dynamic page slug: {dynamic}
    </div>
  )
}

export default Dynamic

ويمكنك الارتباط بها على النحو التالي

<Link href="/[dynamic]" as="/dynamic-page-slug">
  <a>Link to my Dynamic Page</a>
</Link>

 

رابط هذا التعليق
شارك على الشبكات الإجتماعية

انضم إلى النقاش

يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.

زائر
أجب على هذا السؤال...

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   جرى استعادة المحتوى السابق..   امسح المحرر

×   You cannot paste images directly. Upload or insert images from URL.

  • إعلانات

  • تابعنا على



×
×
  • أضف...