找回密码
 立即注册

QQ登录

只需一步,快速开始

phoben 讲师达人认证 悬赏达人认证 活字格认证
论坛元老   /  发表于:2024-7-2 11:33  /   查看:102  /  回复:1
本帖最后由 phoben 于 2024-7-2 11:45 编辑

插件地址:Mustache模板引擎 - 葡萄城市场 (grapecity.com.cn)

先说3个场景:

Web开发:在前端的各类文本内容、HTML内容、提示消息等位置使用动态的内容。
API响应格式化:服务器端使用Mustache将数据格式化为HTML或其他格式的响应。
邮件模板:生成动态内容的邮件模板,如个性化邮件。

  1. Mustache的主要作用是将结构化的数据(比如JSON格式的数据)与模板结合,生成动态内容。
  2. 例如,你有一个邮件模板,但是内部某些内容需要动态生成,这时候你就可以利用Mustache模板语法,在邮件里进行占位,然后通过本插件进行替换。
复制代码

特点:
易上手:简单易用、容易上手,没有太多复杂的规则和结构。
逻辑少:Mustache被设计为"逻辑少"的模板引擎,因此只专注于数据和模板之间的填充,不会引入复杂的编程逻辑。

视频教程:

没有了解过模板引擎的朋友,我这里举个简单例子。
1、文本替换
      这是一个非常基础的用法,在活字格中,我们想要拼接一段动态的内容有时候不那么方便,例如:

       image.png387443541.png


      上面只是一个非常简单的例子,拼接起来是非常麻烦的,假入失败原因有多条记录(根据循环中决定),动态拼接更加麻烦
      使用Mustache模板引擎,我们只需要这么做:

       image.png211365660.png

      显然,使用模板引擎后,对开发者更加友好,也非常容易维护。
      再进一步,假如失败原因有N条,需要全部每行一个展示,怎么做呢?
      非常简单,我们只需要稍微修改一下模板:
      image.png407504577.png
    是不是So easy?
    其实Mustache模板引擎还有很多高级用法,例如动态显示、隐藏某个文本,对象数组的循环显示等。    它最大的特点就是能够根据你的数据源结构,配合模板来渲染成你想要的效果。

   更多用法,大家可以参考官方示例:mustache(5) - Logic-less templates.
   里面讲述了Mustache的所有语法,非常简单。



   下面给大家介绍插件的使用方法
   插件使用也是非常简单,提供模板、提供数据源,OK了。


我们将原始的文本数据直接提供或者提供变量,然后将数据源JSON传递到“设置数据源”参数中即可。
我们测试一下。


结果:


1 个回复

倒序浏览

高级会员   /  发表于:3 天前
沙发
牛 YYDS


回复 使用道具 举报
您需要登录后才可以回帖 登录 | 立即注册
返回顶部