Express Route 和 Nextjs:app.render 在路由器文件中不起作用



我的服务器文件开始有点太长了,所以我决定使用快速路由,并在一个单独的脚本上分割每个路由。我像往常一样做了所有的事情,但问题是:应用程序渲染方法不起作用,页面一直在滚动。这就是索引文件的样子:

const express = require('express');
const router = express.Router();
const Declaration = require("../models/declaration")
const next = require('next')
const app = next({ true })
router.get('/', async (req, res) =>
{
const declarations = await Declaration.find({})
app.render(req, res, "/", { declarations })
})
router.post('/', async (req, res) =>
{
const declaration = new Declaration({ ...req.body })
await declaration.save();
res.redirect("/")
})
module.exports = router;

服务器文件:

...
const index = require("./routes/index")

app.prepare().then(() =>
{
const server = express();
server.use(express.urlencoded({ extended: true }));
server.use(methodOverride('_method'));
server.use(express.static(path.join(__dirname, 'public')));
server.use('/', index)
...

这就是更新前的路线:

...
app.prepare().then(() =>
{
const server = express();
server.use(express.urlencoded({ extended: true }));
server.use(methodOverride('_method'));
server.use(express.static(path.join(__dirname, 'public')));
server.get("/", async (req, res) =>
{
const declarations = await Declaration.find({})
app.render(req, res, "/", { declarations })
})
server.post("/", async (req, res) =>
{
const declaration = new Declaration({ ...req.body })
await declaration.save();
res.redirect("/")
})

...

我真的不知道怎么解决这个问题。

我在另一篇文章中找到了一个解决方案(在Next.js中使用Express Router(。基本上,我要做的是从服务器文件中导出应用程序,并在路由器文件中使用它,而不是导入另一个。

这就是它的结局:

服务器

module.exports = app;
//make sure that app is exported before importing the router files
const index = require("./routes/index")
const view = require("./routes/view")
const edit = require("./routes/edit")
app.prepare().then(() =>
{
const server = express();
server.use(express.urlencoded({ extended: true }));
server.use(methodOverride('_method'));
server.use(express.static(path.join(__dirname, 'public')));
server.use('/', index)
server.use('/view', view)
server.use('/view', edit)

路由器文件

const express = require('express');
const router = express.Router();
const Declaration = require("../models/declaration")
const app = require("../main")
//import app from the server file
router.get('/', async (req, res) =>
{
const declarations = await Declaration.find({})
app.render(req, res, "/", { declarations })
})

所以现在它应该像预期的一样工作

最新更新