可选参数与剩余参数
使用 [[optional]] 处理可选片段,并使用 [...rest] 处理全匹配路由。
可选参数与剩余参数 是 CoddyKit 上的免费 Sveltejs Academy 课时。 这是第 3 节课,共 4 节。 你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。 这是 Sveltejs Academy 学习路径的一部分,你的进度在网页和 CoddyKit 应用中同步。 Sveltejs Academy 课程共包含 4 节课。
可选段
使用双层方括号 [[optional]],将某个段设为可选。
src/routes/[[lang]]/about/+page.svelte两个网址都能匹配
上面的配置同时匹配 /about 和 /en/about。对于前者,lang 未定义。
剩余参数
使用 [...rest],将路径中剩余的所有段捕获为数组。
src/routes/docs/[...slug]/+page.svelte捕获多个段
上面的配置匹配 /docs、/docs/a、/docs/a/b 等路径。params.slug 是连接后的字符串。
使用场景
剩余参数适合文档站点、维基和文件浏览器等路径深度不固定的场景。
组合使用
将可选参数和剩余参数与普通参数混合使用,实现灵活的路由配置。
捕获全部段必须放在最后
剩余参数必须是最后一个段;SvelteKit 会强制执行这一规则。
解码
路径段会进行网址解码;构建网址时请对特殊字符进行编码。
空的剩余参数
空的剩余参数会解析为空字符串。请在加载函数中处理这种情况。
有利于 SEO
剩余路由无需构建庞大的路由树,就能提供嵌套文档。
冲突解决
SvelteKit 会优先选择具体路由,而不是剩余路由。静态路由优先于剩余路由。
快速检查
[...slug] 的作用是什么?
回顾
使用 [[opt]] 表示可选段,使用 [...rest] 表示捕获全部段。两者都能提升路由的灵活性。
常见问题解答
「可选参数与剩余参数」课时是免费的吗?
是的 — 「可选参数与剩余参数」的完整文本可在网页上免费阅读。要进行交互式练习(内置代码编辑器和全天候 AI 导师)并解锁 Sveltejs Academy 课程的其余内容,请升级到 CoddyKit PRO。 Sveltejs Academy 课程共包含 4 节课。
「可选参数与剩余参数」这节课中我会学到什么?
使用 [[optional]] 处理可选片段,并使用 [...rest] 处理全匹配路由。 你通过在浏览器中直接运行的动手代码来练习 Sveltejs Academy,全天候 AI 导师会在你学习这节课的过程中回答你的问题。
学习 Sveltejs Academy 需要有经验吗?
无需任何先前经验。CoddyKit 上的 Sveltejs Academy 课程适合初学者到高级学习者,你可以从这里开始或从头开始,按照自己的节奏学习。 这是第 3 节课,共 4 节。
「可选参数与剩余参数」课时需要多长时间?
大多数 CoddyKit 课程大约需要 5–10 分钟。每节课都很精短且互动,所以你能稳步进步,并在网页和应用中从离开的地方继续。
我能在这节 Sveltejs Academy 课中编写并运行代码吗?
能。每节 Sveltejs Academy 课都包含内置代码编辑器,你可以在浏览器中直接编写并运行真实代码,并获得即时 AI 反馈 — 无需本地设置。