为什么不能修改 CommonJS 模块中对象的值?

Why cannot modify a value of an object in a CommonJS module?

我有这个基本的 koa v2 应用程序,我在其中尝试将模板文字实现为查看引擎。在 ./views/index.js 中,如何从 app.js 填充 state 的值?

我的问题是我想将对象值从 ctx.body = index.render({}) 一直向下推送到 .views/partials/mainTop.js 文件,假设我想在文件之间包含 title 对象值<title></title> 个标签。有没有办法在 app.js 中不需要 .views/partials/mainTop.js 就可以做到这一点?如果它是 handlebars 或 nunjucks 模板,我想用模板文字实现类似的事情。

./app.js

const index = require('./views/index');
const app = new Koa();

app.use(ctx => {
  index.state = {
    foo: 'bar',
  };
  ctx.body = index.render({
    title: 'Template Literals',
    description: 'Vanilla JS rendering',
  });
});

app.listen(3000);

./views/index.js

const main = require('./layouts/main');

let state = {};
module.exports.state = state;
console.log(state); // returning an {} empty object, expected => { foo: "bar" }

module.exports.render = (obj) => {
  return main.render(`
    <p>Hello world! This is HTML5 Boilerplate.</p>
    ${JSON.stringify(obj, null, 4)}}
    ${obj.title}
  `);
};

./views/layouts/main.js

const mainTop = require('../partials/mainTop');
const mainBottom = require('../partials/mainBottom');

module.exports.render = (content) => {
  return `
    ${mainTop.render}

    ${content}

    ${mainBottom()}
  `;
}

./views/partials/mainTop.js

const render = `
  <!doctype html>
  <html class="no-js" lang="">
  <head>
  <title></title>
  ...
`;
module.exports.render = render;

./views/partials/mainBottom.js

module.exports = () => {
  return `
    ...
    </body>
    </html>
  `;
}

console.log(state); // returning an {} empty object, expected => { foo: "bar" }

当然,您将获得刚刚创建的空对象:

  • 在 app.js 中分配给 module.exports.state 属性。您的本地 state 变量不会被覆盖,它引用的对象也不会发生变化。为此,您需要在 index.js.
  • 中执行 index.state.foo = "bar";
  • object/variable 在创建为空对象后立即被记录。 index.js 中的赋值在 app.use 回调中异步发生。如果您在 render 方法中执行了 console.log,在 赋值后称为 ,您将获得预期的值。但是,在那种情况下,您可能应该将其作为参数传递。