Node.js 报错 "title is not defined"

Node.js 报错 "title is not defined"

错误如下： ReferenceError: /Users/victor/mymicroblog/views/layout.ejs:4 2| <html> 3| <head>

4| <title><%= title %></title> 5| <link rel=‘stylesheet’ href=’/stylesheets/bootstrap.css’ /> 6| <style type=“text/css”> 7| body { title is not defined

访问页面locathost:3000/显示内容如下： ReferenceError: /Users/victor/mymicroblog/views/layout.ejs:4 2| <html> 3| <head> >> 4| <title><%= title %></title> 5| <link rel=‘stylesheet’ href=’/stylesheets/bootstrap.css’ /> 6| <style type=“text/css”> 7| body { title is not defined at eval (eval at <anonymous> (/Users/victor/mymicroblog/node_modules/ejs/lib/ejs.js:237:14), <anonymous>:29:89) at eval (eval at <anonymous> (/Users/victor/mymicroblog/node_modules/ejs/lib/ejs.js:237:14), <anonymous>:29:2010) at /Users/victor/mymicroblog/node_modules/ejs/lib/ejs.js:250:15 at Object.exports.render (/Users/victor/mymicroblog/node_modules/ejs/lib/ejs.js:288:13) at View.exports.renderFile [as engine] (/Users/victor/mymicroblog/node_modules/ejs/lib/ejs.js:318:20) at View.render (/Users/victor/mymicroblog/node_modules/express/lib/view.js:76:8) at Function.app.render (/Users/victor/mymicroblog/node_modules/express/lib/application.js:503:10) at ServerResponse.res.render [as partial] (/Users/victor/mymicroblog/node_modules/express/lib/response.js:802:7) at /Users/victor/mymicroblog/node_modules/express-partials/index.js:75:13 at View.exports.renderFile [as engine] (/Users/victor/mymicroblog/node_modules/ejs/lib/ejs.js:318:3)

我的layout.ejs相关代码片段如下： <!DOCTYPE html> <html> <head> <title><%= title %></title> <link rel=‘stylesheet’ href=’/stylesheets/bootstrap.css’ /> <style type=“text/css”> body { padding-top: 60px; padding-bottom: 40px;} </style> …

我的routes/index.js相关代码片段如下： router.get(’/’, function(req, res) { res.render(‘index’, { title: ‘首页’ }); });


5 回复

Node.js 报错 “title is not defined”

错误描述

在使用 EJS 模板引擎时，你遇到了一个 ReferenceError，提示 title is not defined。这通常是因为在渲染模板时，传递给模板的数据中缺少了 title 变量。

错误原因

在你的 layout.ejs 文件中，你尝试使用了一个未定义的变量 title。具体来说，第 4 行的代码如下：

<title><%= title %></title>

而你在路由处理函数中传递给模板的数据中并没有包含 title 这个变量。因此，EJS 在渲染模板时无法找到 title 的值，从而抛出了 ReferenceError。

示例代码

routes/index.js

确保在路由处理函数中正确传递了 title 变量。例如：

const express = require('express');
const router = express.Router();

router.get('/', function(req, res) {
    res.render('index', { title: '首页' });
});

module.exports = router;

layout.ejs

确保模板文件中正确引用了 title 变量。例如：

<!DOCTYPE html>
<html>
<head>
    <title><%= title %></title>
    <link rel="stylesheet" href="/stylesheets/bootstrap.css" />
    <style type="text/css">
        body {
            padding-top: 60px;
            padding-bottom: 40px;
        }
    </style>
</head>
<body>
    <!-- 其他内容 -->
</body>
</html>

解释

  • routes/index.js: 在路由处理函数中，我们使用 res.render() 方法来渲染模板，并传递了一个包含 title 属性的对象。这样，EJS 就可以在模板中正确地使用 title 变量。

  • layout.ejs: 在模板文件中，我们通过 <%= title %> 来插入 title 变量的值。如果这个变量没有被定义，就会抛出错误。

通过上述修改，你应该能够解决 title is not defined 的问题。


layout 里用locals.title

真能挖坟。。

原因就是 index 可以直接用 <%= title %> ，layout 里要用 <%= locals.title %>

根据你提供的错误信息和代码片段，问题在于 layout.ejs 模板文件中使用了变量 title，但该变量没有被正确传递给模板。

示例代码与解释

在你的 routes/index.js 文件中，你需要确保将 title 变量传递给 layout.ejs。你已经在路由中传递了一个 title 给 index.ejs，但还需要确保这个 title 变量能够在 layout.ejs 中被访问到。

修改后的 routes/index.js

const express = require('express');
const router = express.Router();

router.get('/', function(req, res) {
    // 确保传递 title 变量给 layout.ejs
    res.render('index', { 
        title: '首页',
        layout: 'layout'  // 明确指定 layout
    });
});

module.exports = router;

修改后的 views/layout.ejs

确保 layout.ejs 能够接收到并使用传递过来的 title 变量：

<!DOCTYPE html>
<html>
<head>
  <title><%= title %></title>
  <link rel="stylesheet" href="/stylesheets/bootstrap.css" />
  <style type="text/css">
    body {
      padding-top: 60px;
      padding-bottom: 40px;
    }
  </style>
</head>
<body>
  <%- body %>
</body>
</html>

解释

  • 在 routes/index.js 中，确保将 title 变量传递给 layout.ejs，并且明确指定使用 layout 模板。
  • 在 layout.ejs 中，通过 <%= title %> 访问传递过来的 title 变量。

如果仍然遇到问题，请检查是否有其他中间件或路由处理程序覆盖了 title 变量。希望这能解决你的问题。

回到顶部