当前位置: 首页 > 工具软件 > koa-views > 使用案例 >

Koa2 渲染视图koa-views

史劲
2023-12-01

koa-views 是一个使用模板引擎渲染视图的 Koa 中间件。它可以集成多种模板引擎,包括 EJS、Pug、Handlebars 等等。

下面是使用 koa-views 渲染 EJS 模板的简单示例:

  1. 安装 koa-views 和 EJS:

    npm install koa-views ejs
    
  2. 引入 koa-views 和 Koa:

    const Koa = require('koa');
    const views = require('koa-views');
    
  3. 创建 Koa 应用程序实例,并配置 koa-views 中间件:

    const app = new Koa();
    
    app.use(views(__dirname + '/views', {
      extension: 'ejs' // 使用 EJS 模板引擎
    }));
    

    __dirname 表示当前文件所在目录,这里将其和 /views 目录路径拼接起来作为视图文件所在的根目录。

  4. 创建 EJS 模板文件:

    在上一步指定的 /views 目录下创建 index.ejs 文件,内容如下:

    <html>
      <head>
        <title><%= title %></title>
      </head>
      <body>
        <h1><%= message %></h1>
      </body>
    </html>
    

    <%=%> 之间的表达式会被解析为 JavaScript 代码,可以在其中使用任何合法的 JavaScript 语句。

  5. 在路由中使用 koa-views 渲染视图:

    app.use(async ctx => {
      await ctx.render('index', { // 第一个参数是模板文件名,无需带扩展名
        title: 'Welcome to Koa',
        message: 'Hello, world!'
      });
    });
    

    ctx.render 方法会自动将传入的数据和指定模板文件合并,并返回渲染后的 HTML 页面作为响应。这里传递了 titlemessage 两个变量给 EJS 模板使用。

以上就是使用 koa-views 渲染 EJS 模板的基本用法。可以根据具体需求灵活配置中间件和模板引擎选项,实现更加复杂的视图渲染效果。

 类似资料: