如何根据查询参数动态路由?

时间:2019-04-04 01:31:22

标签: next.js

我正在尝试根据来自API调用的id值路由到组件。

在正常的React中,我只是使用React Router,路由为/ new-car /:id,并渲染了一个名为Item的组件,并通过道具传递了一些不同的东西。

现在,我正在使用Next.js进行尝试,并且不知道如何实现同一目标。这是我的服务器端代码(大部分是借来的):

const express = require("express");
const next = require("next");

const dev = process.env.NODE_ENV !== "production";
const app = next({ dev });
const handle = app.getRequestHandler();

app.prepare().then(() => {
  const server = express();

  server.get("new-inventory/:id", (req, res) => {
    const mergedQuery = Object.assign({}, req.query, req.params);
    return app.render(req, res, "./components/item", mergedQuery);
  });

  server.get("*", (req, res) => {
    return handle(req, res);
  });

  const port = process.env.PORT || 3000;

  server.listen(port, err => {
    if (err) throw err;
    console.log(`> Ready on port ${port}...`)
  });
});

这显然应该处理路由参数并渲染项目组件,就像在React Router中使用Route标签一样,但是似乎什么也没做?

0 个答案:

没有答案
相关问题