单击 NextJS 的按钮后，服务器端在 React 中呈现模态
Server-side render a modal in React upon clicking a button for NextJS
我想在单击按钮时在服务器端呈现 ReactJS 中的模式。您可以在 Product Hunt 的网站上查看示例：
如果您点击其中一种热门产品，它会打开一个模式，然后页面在服务器端呈现为正常请求。
我不是很擅长 React，但是有人可以为我指明正确的方向或展示代码示例吗？
我想我可以在有人单击激活模式的 link 时预取页面，然后在模式中显示获取的内容：https://github.com/zeit/next.js/tree/master/examples/with-prefetching
我认为 producthunt 上的产品模式不是服务器呈现的。当您单击产品时，它会打开模式，然后加载数据客户端。与此操作一起，还会使用 history 更新 URL。现在，如果您刷新页面，它将呈现不同的视图。您可以使用 next 通过以相似的方式拥有两个不同的视图来实现这一点。例如，您可以在 pages 目录中创建两个页面，例如：
pages
|- homepage.js
|- product.js
然后在您的服务器配置中，您可以路由从 /product 开始的所有请求以呈现 product.js。模态逻辑可以保留在 homepage.js 中，您可以在点击产品时呈现适当的模态。您也可以在打开模式时将 url 推送到历史记录。
现在，如果刷新页面或新浏览器 tab/window 打开相同的 url，它会要求服务器呈现 product.js。
我想在单击按钮时在服务器端呈现 ReactJS 中的模式。您可以在 Product Hunt 的网站上查看示例：
如果您点击其中一种热门产品，它会打开一个模式，然后页面在服务器端呈现为正常请求。
我不是很擅长 React，但是有人可以为我指明正确的方向或展示代码示例吗？
我想我可以在有人单击激活模式的 link 时预取页面，然后在模式中显示获取的内容：https://github.com/zeit/next.js/tree/master/examples/with-prefetching
我认为 producthunt 上的产品模式不是服务器呈现的。当您单击产品时，它会打开模式，然后加载数据客户端。与此操作一起，还会使用 history 更新 URL。现在，如果您刷新页面，它将呈现不同的视图。您可以使用 next 通过以相似的方式拥有两个不同的视图来实现这一点。例如，您可以在 pages 目录中创建两个页面，例如：
pages
|- homepage.js
|- product.js
然后在您的服务器配置中，您可以路由从 /product 开始的所有请求以呈现 product.js。模态逻辑可以保留在 homepage.js 中，您可以在点击产品时呈现适当的模态。您也可以在打开模式时将 url 推送到历史记录。
现在，如果刷新页面或新浏览器 tab/window 打开相同的 url，它会要求服务器呈现 product.js。