解決koa2 ctx.render is not a function報(bào)錯(cuò)問(wèn)題

發(fā)布時(shí)間：2020-10-23 04:16:04 來(lái)源：腳本之家閱讀：400 作者：wopelo 欄目：web開(kāi)發(fā)

最近在學(xué)習(xí)使用koa2，在嘗試用koa2復(fù)寫(xiě)之前用express寫(xiě)的一個(gè)入口文件的時(shí)候發(fā)現(xiàn)命令行報(bào)錯(cuò)ctx.render is not a function

項(xiàng)目路徑如下

解決koa2 ctx.render is not a function報(bào)錯(cuò)問(wèn)題

app.js是之前用express寫(xiě)的入口文件

koa.js是用koa2復(fù)寫(xiě)的入口文件

view是前端頁(yè)面文件夾，使用的模板引擎是pug

報(bào)錯(cuò)時(shí)koa.js代碼如下

//使用koa復(fù)寫(xiě)入口文件
const Koa = require('koa');
const Router = require('koa-router');
const koaBody = require('koa-body');
const views = require('koa-views');
const serve = require('koa-static');

const app = new Koa();
const router = new Router();

app.use(serve(__dirname));
app.use(koaBody()).use(router.routes());
app.use(views(__dirname + '/views/pages',{
  extension: 'pug'
}))

app.listen(3000);

router.get('/', async(ctx, next) => {
  await ctx.render("index",{
    title:"nodeWeb 首頁(yè)"
  })
});

其實(shí)這個(gè)bug很好解決，那就是把配置模板引擎的代碼移動(dòng)到所有與路由相關(guān)的代碼之前，在這里就應(yīng)該修改為

//使用koa復(fù)寫(xiě)入口文件
const Koa = require('koa');
const Router = require('koa-router');
const koaBody = require('koa-body');
const views = require('koa-views');
const serve = require('koa-static');

const app = new Koa();
const router = new Router();

app.use(serve(__dirname));
//配置模板引擎
app.use(views(__dirname + '/views/pages',{
  extension: 'pug'
}))
//使用koa-router
app.use(koaBody()).use(router.routes());

app.listen(3000);

//設(shè)置路由
router.get('/', async(ctx, next) => {
  await ctx.render("index",{
    title:"nodeWeb 首頁(yè)"
  })
});

造成這個(gè)bug的原因是因?yàn)橹虚g件的執(zhí)行是有順序的，路由在前，然后模板引擎在后的話，當(dāng)執(zhí)行到ctx.render的時(shí)候，模板引擎相關(guān)的中間件還未執(zhí)行，render方法還未綁定到ctx上，所以就會(huì)報(bào)ctx.render is not a function

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持億速云。

向AI問(wèn)一下細(xì)節(jié)

解決koa2 ctx.render is not a function報(bào)錯(cuò)問(wèn)題

猜你喜歡

最新資訊

相關(guān)推薦

相關(guān)標(biāo)簽