如何在NextJS中的路径中间设置搜索参数?

mzillmmw  于 2023-10-18  发布在  其他
关注(0)|答案(1)|浏览(130)

我试图创建一个页面,用户选择一个表单,然后被路由到正确的表单页面
我有当前的文件夹结构:
patients/[patientId]/forms/type1/[type1Code]
patients/[patientId]/forms/type2/[type2Code]
在type1和type2下,我有一个包含Select组件的布局,用户可以在其中获得不同表单的所有选项。
此选择组件在onChange时执行以下操作:

const handleOnChange = (value: string) => {
    if (!formCodeId) {
      return router.push(`${path}?${searchParams.toString()}/${value}`);
    }
    router.push(value);
  };

当我选择一个表单时,它会路由到patients/[patientId]/forms/type1?param1=123/123code,但它似乎没有命中[type1Code]文件夹中的page.tsx。为什么会这样呢?在url路径的中间有搜索参数是无效的语法吗?或者你需要以某种方式告诉NextJS这件事吗?

mgdq6dx1

mgdq6dx11#

我怀疑你试图实现的目标是否会得到任何框架的支持,更不用说Next.JS了。
在URL中,第一个问号之后的任何内容都被认为是查询字符串。所以基本上你的URL
patients/[patientId]/forms/type1?param1=123/123code
匹配patients/[patientId]/forms/type1,其余的URL数据将在查询参数中可用。
RFC是这样说的:
查询组件由第一个问号(“?“)字符,并以数字符号(“#”)字符或URI的结尾结束。
链接到RFC

相关问题