在构建 JavaScript 界面时,通常需要将 DOM 渲染为 HTML 模板。Frappe 框架使用 John Resig 的 Microtemplate 脚本在 Desk 应用程序中渲染 HTML 模板。
> 注意 1:在 Frappe 中,我们使用类似 Jinja 的 {% raw %}{%{% endraw %} 标签来嵌入代码,而不是标准的 <%
> 注意 2:切勿在 HTML 模板中使用单引号 '。
要渲染模板,请执行以下操作:
- 在您的应用中创建一个模板
html文件。例如:address_list.html - 将其添加到您应用的
build.json中(您可以将其包含在frappe.min.js或您自己的 JavaScript 文件中)。 - 要在您的应用中渲染它,请使用
frappe.render(frappe.templates.address_list, {[context]})
示例模板:
来自 erpnext/public/js/templates/address_list.js
<p>
<button class="btn btn-sm btn-default btn-address">New Address</button>
</p>
{% for(var i=0, l=addrlist.length; i<l; i++) { %}
<hr>
{%= _("Edit") %}
{%= addr_list[i].address_type %}
{% if(addr_list[i].is_primary_address) { %}
{%= __("Primary") %}
{% } %}
{% if(addr_list[i].is_shipping_address) { %}
{%= __("Shipping") %}
{% } %}
{%= addr_list[i].display %}
{% } %}
{% if(!addrlist.length) { %}
{%= _("No address added yet.") %}
{% } %}