Web前端必做笔记之一：Nunjucks基础使用（二）
怎么使用get处理表单数据？
views目录下中的index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title></title>
</head>
<body>
<form action="/login">
<input type="text" name="username">
<input type="password" name="password">
<input type="submit" value="登录">
</form>
</body>
</html>
再创建一个home.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title></title>
</head>
<body>
<p>用户名：{{username}}</p>
<p>密码：{{password}}</p>
</body>
</html>
server.js中
const Koa = require('koa');
const router = require('koa-router')();
const views = require('koa-views');
const nunjucks = require('nunjucks');
const app = new Koa();
app.use(views(__dirname + "/views",{
map:{html:'nunjucks'}
}))
router.get("/", async ctx =>{
await ctx.render("index",{title:"首页"})
})
router.get("/video",async ctx =>{
await ctx.render("index",{title:"视频"})
})
router.get("/login",async ctx =>{
let username = ctx.query.username;
let password = ctx.query.password;
await ctx.render("home",{
username:username,
password:password
})
})
app.use(router.routes());
app.listen(3000, () => {
console.log("server running")
})
|