MJML - 模板插值,动态数据,上下文

Hit*_*nds 8 node.js reactjs server-side-rendering react-server mjml

经过大量搜索后,我很难找到:

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

我期待的是:

import { mjml2html } from 'mjml';

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

const view = mjml2html(template, context);
Run Code Online (Sandbox Code Playgroud)
<mjml>
  <mj-body>
    <mj-container>
      <mj-section>
        <mj-column>
          <mj-text>{message}</mj-text>
        </mj-column>
      </mj-section>
    </mj-container>
  </mj-body>
</mjml>
Run Code Online (Sandbox Code Playgroud)

Ben*_*une 18

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);
Run Code Online (Sandbox Code Playgroud)

  • 由于MJML不支持模板,你不会得到更好的结果. (4认同)
  • 这个名为 [mjml-utils](https://github.com/justinsisley/mjml-utils) 的 mjml 实用程序库对我来说效果很好。 (2认同)