Блог

Главная - Вопросы по программированию - Как я могу использовать динамические маршруты в nexy.js наборный шрифт

Как я могу использовать динамические маршруты в nexy.js наборный шрифт

#reactjs #typescript #next.js

Вопрос:

У меня есть такая структура папок

введите описание изображения здесь

[постИд].ts

 import { useRouter } from 'next/router'

const Post = () => {
  const router = useRouter()
  const { pid } = router.query

  return <p>Post: {pid}</p>
}

export default Post

и я получаю эту ошибку, и я не знаю, как ее исправить, может кто-нибудь сказать мне, как ее решить?

введите описание изображения здесь

upd:

Может быть, проблема в моем tsconfig.json

  {
  "compilerOptions": {
    "target": "esnext",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": false,
    "forceConsistentCasingInFileNames": true,
    "noEmit": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve"
  },
  "exclude": [
    "node_modules"
  ],
  "include": [
    "next-env.d.ts",
    "**/*.ts",
    "**/*.tsx"
  ]
}

Комментарии:

1. что произойдет, если вы {pid} временно удалитесь? Кстати, вы должны использовать const { postId } = router.query

2. @SomeoneSpecial ничего особенного, я могу оставить только текст, и он все равно не работает

3. Вы следовали инструкциям NextJS по настройке машинописи? Коды, которые вы показали, по крайней мере, не ошибочны (за исключением того, что я упомянул выше).

4. @SomeoneSpecial да, я следил за документами nextjs

5. @SomeoneSpecial это, вероятно, должно быть что-то с машинописным текстом

Ответ №1:

У вас есть имя файла [postId] , поэтому должно быть ваше имя параметра:

 const { postId } = router.query

Комментарии:

1. codesandbox.io/s/zealous-browser-hvhn4?file=/pages/posts/…

Ответ №2:

Ваше имя файла должно быть типа jsx / tsx, поэтому

вместо

 [postId].ts

Должно быть

 [postId].tsx

Ответ №3:

Я только что перешел с webstorm на vscode, и все работает нормально, возможно, это была проблема в моем файле tsconfig

Метки: