如何将静态字符串与Next.js动态路线中的动态sl结合在一起？

发布于 2025-02-13 23:20:00 字数 178 浏览 0 评论 0原文

我尝试检查官方文档，各种问题以及以前的问题，但是如果可以在Next中创建动态路线，我找不到确认。JS包含常数或字符串与SLUG结合在一起。例如？

pages/
  something-[slug].jsx

是否有可能？我倾向于思考不是因为我试图构建的示例，但可能我缺少一些东西。

原文

I've tried to check through the official documentation, various issues, and inside SO previous questions, but I can't find confirmation if it's possible to create a dynamic route in Next.js that contains a constant or a string combined with a slug. For example?

pages/
  something-[slug].jsx

Is it possible or not? I'm inclined to think not because of the examples I've tried to build, but possibly I'm missing something.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

岁月静好 2025-02-20 23:20:00

虽然Next.js不能为部分动态路由提供内置支持（例如sosings- [slug]），但您可以通过设置实际动态路线并使用 reprites to to将传入的URL（您想要的格式）映射到该路线。

例如，您可以在/pages/sosings/[slug] .jsx下设置动态路线/代码>如下。

// next.config.js

module.exports = {
    async rewrites() {
        return [
            {
                source: '/something-:slug',
                destination: '/something/:slug'
            }
        ];
    }
}

While Next.js doesn't provide built-in support for partial dynamic routes (like something-[slug]), you can work around it by setting up an actual dynamic route and use rewrites to map the incoming URL (in the format you want) to that route.

For instance, you could setup a dynamic route under /pages/something/[slug].jsx, then configure a rewrites rule in next.config.js as follows.

// next.config.js

module.exports = {
    async rewrites() {
        return [
            {
                source: '/something-:slug',
                destination: '/something/:slug'
            }
        ];
    }
}

回复收藏 0 原文

神爱温柔 2025-02-20 23:20:00

页/
某物 - [slug] .jsx

这对我来说很好：

// next.config.js

module.exports = {
    async rewrites() {
        return [
            {
                source: "/something-:slug",
                destination: "/something-[slug]",
            }
        ];
    }
}

localhost：3000/shots slug

pages/
something-[slug].jsx

This worked just fine for me:

// next.config.js

module.exports = {
    async rewrites() {
        return [
            {
                source: "/something-:slug",
                destination: "/something-[slug]",
            }
        ];
    }
}

localhost:3000/something-slug

回复收藏 0 原文

~没有更多了~