MJML - 模板插值、动态数据、上下文答案

【问题标题】：MJML - Template Interpolation, Dynamic Data, ContextMJML - 模板插值、动态数据、上下文
【发布时间】：2017-08-24 00:15:11
【问题描述】：

经过大量搜索，我很难找到如何：

MJML 处理动态数据和模板插值

我期待的是这样的：

import { mjml2html } from 'mjml';

const context = {
  message: 'Hello World'
};

const view = mjml2html(template, context);

<mjml>
  <mj-body>
    <mj-container>
      <mj-section>
        <mj-column>
          <mj-text>{message}</mj-text>
        </mj-column>
      </mj-section>
    </mj-container>
  </mj-body>
</mjml>

【问题讨论】：

MJML 不处理任何模板。如果需要模板，请使用模板引擎渲染到 MJML。
你能解释清楚吗？
你记下来了吗？我一直试图弄清楚如何在 for each 循环中处理动态数据。 @Hitmands
我通过不使用mjml 解决了这个问题。这是一个关键特性，渲染两次并不理想......所以我们只是选择了更多实用的反应组件！

标签： node.js reactjs server-side-rendering react-server mjml

【解决方案1】：

MJML 不处理任何模板。如果需要模板，请使用把手等模板引擎渲染到 MJML。

import { compile } from 'handlebars';
import { mjml2html } from 'mjml';

const template = compile(`
<mjml>
  <mj-body>
    <mj-container>
      <mj-section>
        <mj-column>
          <mj-text>{{message}}</mj-text>
        </mj-column>
      </mj-section>
    </mj-container>
  </mj-body>
</mjml>
`);
const context = {
    message: 'Hello World'
};
const mjml = template(context);
const html = mjml2html(mjml);

【讨论】：

双往返存在性能问题。
由于 MJML 不支持模板，您不会得到更好的结果。
这个名为 mjml-utils 的 mjml 实用程序库对我很有用。