reactjs 将动态url参数传递给一个没有隐式类型的函数(next.js typescript)

0x6upsns  于 2023-03-17  发布在  React
关注(0)|答案(1)|浏览(146)

对严格接收 string 类型参数的函数使用useRouter会产生以下错误:
键入'string|字符串[]|“undefined”不能赋值给类型“string”。类型“undefined”不能赋值给类型“string”
有没有办法在不使用隐式类型的情况下修复错误?

import { useRouter } from 'next/router'
import { useBlogQuery } from '@graphql/generated'

const router = useRouter()
const blogId = router.query.blogId

const BlogQuery = useBlogQuery({
    variables: {
        id: blogId
    },
})
drnojrws

drnojrws1#

这实际上是一个有用的类型检查错误。
考虑:

  1. www.example.com x1月1x
  2. www.example.com/?blogId=1&blogId=2router.query.blogId = [1, 2]
  3. www.example.com/?blogId=1router.query.blogId = 1
    如果您100%确定情况1和2永远不会发生,则可以执行此操作:
const blogId = router.query.blogId as string;

但最好在blogIdundefined还是数组周围添加一些逻辑。

相关问题