Koa2 是一个轻量级的 Node.js Web 框架，它的核心是基于异步流程控制的中间件机制。在前端开发中，我们经常需要使用模板引擎来渲染页面和处理数据，而 Koa2 也提供了很好的支持。本文将介绍 Koa2 中如何使用模板引擎进行页面渲染和数据处理，帮助读者更好地理解 Koa2 的使用。
1. 安装模板引擎
Koa2 支持多种模板引擎，本文以 EJS 为例进行介绍。首先需要安装 EJS：
npm install ejs --save
2. 配置模板引擎
在 Koa2 中，我们需要使用 koa-views 中间件来配置模板引擎。在安装 koa-views 之前，我们还需要安装 koa-router 中间件，用于处理路由。
npm install koa-router koa-views --save
在 app.js 中配置 koa-views：
// javascriptcn.com 代码示例
const Koa = require('koa');
const Router = require('koa-router');
const views = require('koa-views');
const app = new Koa();
const router = new Router();
// 配置模板引擎
app.use(views(__dirname + '/views', {
extension: 'ejs'
}));
// 配置路由
router.get('/', async (ctx, next) => {
await ctx.render('index', {
title: 'Koa2 教程之模板渲染和数据处理',
content: '欢迎来到 Koa2 教程'
});
});
app.use(router.routes());
app.use(router.allowedMethods());
app.listen(3000, () => {
console.log('Server is running at http://localhost:3000');
});在上面的代码中，我们使用了 koa-views 中间件来配置 EJS 模板引擎，指定了模板文件存放的目录为 views，扩展名为 ejs。在路由中，我们使用了 ctx.render() 方法来渲染模板，并传递了 title 和 content 两个变量。
3. 数据处理
在实际开发中，我们经常需要对数据进行处理，比如从数据库中获取数据、调用 API 接口等。在 Koa2 中，我们可以使用 koa-bodyparser 中间件来解析请求体，从而获取 POST 请求中的数据。
// javascriptcn.com 代码示例
const Koa = require('koa');
const Router = require('koa-router');
const views = require('koa-views');
const bodyParser = require('koa-bodyparser');
const app = new Koa();
const router = new Router();
app.use(bodyParser());
// 配置模板引擎
app.use(views(__dirname + '/views', {
extension: 'ejs'
}));
// 配置路由
router.get('/', async (ctx, next) => {
await ctx.render('index', {
title: 'Koa2 教程之模板渲染和数据处理',
content: '欢迎来到 Koa2 教程'
});
});
router.post('/submit', async (ctx, next) => {
const data = ctx.request.body;
console.log(data);
ctx.body = '提交成功';
});
app.use(router.routes());
app.use(router.allowedMethods());
app.listen(3000, () => {
console.log('Server is running at http://localhost:3000');
});在上面的代码中，我们使用了 koa-bodyparser 中间件来解析请求体，然后在 /submit 路由中获取了 POST 请求中的数据，并输出到控制台。
4. 示例代码
完整的示例代码如下：
// javascriptcn.com 代码示例
const Koa = require('koa');
const Router = require('koa-router');
const views = require('koa-views');
const bodyParser = require('koa-bodyparser');
const app = new Koa();
const router = new Router();
app.use(bodyParser());
// 配置模板引擎
app.use(views(__dirname + '/views', {
extension: 'ejs'
}));
// 配置路由
router.get('/', async (ctx, next) => {
await ctx.render('index', {
title: 'Koa2 教程之模板渲染和数据处理',
content: '欢迎来到 Koa2 教程'
});
});
router.post('/submit', async (ctx, next) => {
const data = ctx.request.body;
console.log(data);
ctx.body = '提交成功';
});
app.use(router.routes());
app.use(router.allowedMethods());
app.listen(3000, () => {
console.log('Server is running at http://localhost:3000');
});5. 总结
本文介绍了 Koa2 中如何使用模板引擎进行页面渲染和数据处理。通过学习本文，读者可以更好地理解 Koa2 的使用，同时也可以应用到实际的开发中。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/655c594ed2f5e1655d673530