Next.js-基于路由的模态

reactjs React.js

Mandy

2020-04-07

使用Next.js时，我想在另一页顶部显示基于URL的模式。

如果gallery.js是页面组件，我想/gallery/image/1232132在图库页面顶部显示一个带有图像的模式。

那可能吗？

第4119篇《Next.js-基于路由的模态》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

共1个回答
飞云 2020.04.07

是的！您可以使用window.history.pushState更改网址，而无需切换组件。

// Modal Button
<button onClick={() => {
    this.setState({ modal: true });
    window.history.pushState("","","/gallery/image/img_1233")
}}>
    Open Modal
</button>

//Link Button
<Link href="/gallery/image/img_1233">
    <a>Open Page</a>
</Link>

完整示例在这里：https : //github.com/mohammad-amin-hesam/react-modal-route-example

相似问题

0 回答

0 回答

5 回答

25 回答

0 回答

0 回答

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android