如何在没有渲染引擎的情况下在 javascript 中渲染列表？答案

【问题标题】：How to render a list without a render engine in javascript?如何在没有渲染引擎的情况下在 javascript 中渲染列表？
【发布时间】：2019-09-14 01:38:16
【问题描述】：

没有渲染引擎，除了 express 没有框架。

我们希望在不借助渲染引擎的情况下从数据库查询中渲染任何列表。

什么是数据列表渲染引擎的裸代码等价物？

这是一个 pug 的例子，然后是 html ：

app.js

collection.query(q, function(err, docs) {
    if (err) {
        res.status(500).send({
            error: err
        });
        return;
    }

    console.log("Got docs: ",docs);

    res.render('layout', {
        data : docs
    });

});

HTML

<ul type="1">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>

您如何编写代码以在没有 pug 的情况下使用来自查询响应的数据进行渲染？

ul
    each item in data
        li=item.name

【问题讨论】：

只是..照你说的做？如果您不想要任何框架或渲染引擎等，那么（a）为什么要显示 .pug 文件（这是一个模板，需要 pug 渲染引擎）和（b）只生成纯文本 HTML 并将其发送作为回应？
如果你生成这样的 html，你很快就会遇到那些模板引擎的创建者遇到的同样的问题，这促使他们首先设计模板引擎。

标签： html node.js express

【解决方案1】：

const createList = items => `<ol>${items.map(i => `<li>${i}<li/>`).join("")}<ol/>`;

collection.query(q, function(err, docs) {
    if (err) {
        res.status(500).send({
            error: err
        });
        return;
    }

    console.log("Got docs: ",docs);

    res.send(createList(docs))

});

这是使用箭头函数和模板文字，如果您使用的是旧版本的nodejs，您可以将箭头函数更改为普通functions，并将模板文字更改为+连接的字符串。

【讨论】：

这里，如果有人提供了您问题的答案，您可以将答案标记为正确，只需说 (@Conan)。
您将 undefined 作为项目传递，也许您需要检查 docs 变量