美文网首页
2021-11-17 dart模版解析mustache

2021-11-17 dart模版解析mustache

作者: 我是小胡胡123 | 来源:发表于2021-11-18 08:19 被阅读0次

dart实现:
https://github.com/valotas/mustache4dart

import 'package:mustache/mustache.dart' as mustache;

使用实例:

  final List<Map<String, dynamic>> pluginConfigs = <Map<String, dynamic>>[];
  for (MagpiePluginInfo p in plugins) {
    pluginConfigs.add(<String, dynamic>{
      'name': p.name,
      'prefix': p.iosPrefix,
      'class': p.pluginClass,
    });
  }
  final Map<String, dynamic> context = <String, dynamic>{
    'os': 'ios',
    'deploymentTarget': '8.0',
    'framework': 'Flutter',
    'plugins': pluginConfigs,
  };
  final String template =
      mustache.Template(sourceTemplate, htmlEscapeValues: false)
          .renderString(context);

sourceTemplate内容如下:

//
//  Generated file. Do not edit.
//

#import "GeneratedPluginRegistrant.h"

{{#plugins}}
#if __has_include(<{{name}}/{{class}}.h>)
#import <{{name}}/{{class}}.h>
#else
@import {{name}};
#endif
{{/plugins}}

@implementation GeneratedPluginRegistrant

+ (void)registerWithRegistry:(NSObject<FlutterPluginRegistry>*)registry {
{{#plugins}}
  [{{prefix}}{{class}} registerWithRegistrar:[registry registrarForPlugin:@"{{prefix}}{{class}}"]];
{{/plugins}}
}

@end


就是将模版里面里prefix,class,name用数据填充替换。
代表数组:
{{#plugins}}
{{/plugins}}
代表某个值
{{name}};

一一替换。得到输出结果:


//
//  Generated file. Do not edit.
//

#import "GeneratedPluginRegistrant.h"

#if __has_include(<device_info/FLTDeviceInfoPlugin.h>)
#import <device_info/FLTDeviceInfoPlugin.h>
#else
@import device_info;
#endif
#if __has_include(<fluttertoast_renameuiviewtoast/FluttertoastPlugin.h>)
#import <fluttertoast_renameuiviewtoast/FluttertoastPlugin.h>
#else
@import fluttertoast_renameuiviewtoast;
#endif
#if __has_include(<fluwx_no_pay/FluwxPlugin.h>)
#import <fluwx_no_pay/FluwxPlugin.h>
#else
@import fluwx_no_pay;
#endif
#if __has_include(<media_upload/MediaUploadPlugin.h>)
#import <media_upload/MediaUploadPlugin.h>
#else
@import media_upload;
#endif
#if __has_include(<path_provider/FLTPathProviderPlugin.h>)
#import <path_provider/FLTPathProviderPlugin.h>
#else
@import path_provider;
#endif
#if __has_include(<shared_preferences/FLTSharedPreferencesPlugin.h>)
#import <shared_preferences/FLTSharedPreferencesPlugin.h>
#else
@import shared_preferences;
#endif
#if __has_include(<sqflite/SqflitePlugin.h>)
#import <sqflite/SqflitePlugin.h>
#else
@import sqflite;
#endif
#if __has_include(<url_launcher/FLTURLLauncherPlugin.h>)
#import <url_launcher/FLTURLLauncherPlugin.h>
#else
@import url_launcher;
#endif
#if __has_include(<wuba_bugly_plugin/WubaBuglyPlugin.h>)
#import <wuba_bugly_plugin/WubaBuglyPlugin.h>
#else
@import wuba_bugly_plugin;
#endif

@implementation GeneratedPluginRegistrant

+ (void)registerWithRegistry:(NSObject<FlutterPluginRegistry>*)registry {
  [FLTDeviceInfoPlugin registerWithRegistrar:[registry registrarForPlugin:@"FLTDeviceInfoPlugin"]];
  [FluttertoastPlugin registerWithRegistrar:[registry registrarForPlugin:@"FluttertoastPlugin"]];
  [FluwxPlugin registerWithRegistrar:[registry registrarForPlugin:@"FluwxPlugin"]];
  [MediaUploadPlugin registerWithRegistrar:[registry registrarForPlugin:@"MediaUploadPlugin"]];
  [FLTPathProviderPlugin registerWithRegistrar:[registry registrarForPlugin:@"FLTPathProviderPlugin"]];
  [FLTSharedPreferencesPlugin registerWithRegistrar:[registry registrarForPlugin:@"FLTSharedPreferencesPlugin"]];
  [SqflitePlugin registerWithRegistrar:[registry registrarForPlugin:@"SqflitePlugin"]];
  [FLTURLLauncherPlugin registerWithRegistrar:[registry registrarForPlugin:@"FLTURLLauncherPlugin"]];
  [WubaBuglyPlugin registerWithRegistrar:[registry registrarForPlugin:@"WubaBuglyPlugin"]];
}

@end

大概原理跟js的同类库一样
https://www.jianshu.com/p/7f1cecdc27e1

Mustache 是一款经典的前端模板引擎,在前后端分离的技术架构下面,前端模板引擎是一种可以被考虑的技术选型,随着重型框架(AngularJS、ReactJS、Vue)的流行,前端的模板技术已经成为了某种形式上的标配,Mustache 的价值在于其稳定和经典.

相关文章

  • 2021-11-17 dart模版解析mustache

    dart实现:https://github.com/valotas/mustache4dart[https://g...

  • mustache模版引擎

    一、简介 什么是模板引擎? 模板引擎是将数据变为视图最优雅的解决方法。 二、历史发展 历史上曾经出现过的其它数据变...

  • Vapor系列教程 - Views

    Vapor 可直接返回纯 HTML 页面,也可以用 Mustache 或 Stencil 模版来渲染页面。 目录 ...

  • Dart类模版创建

    新建Dart文件模版,仅限Android Studio开发; 目前新建Dart文件之后,是一个空类,不包含任何代码...

  • Vue深入解析-Mustache

    Vue本身是一款非常优秀的前端框架,通过简洁的API提供高效的数据绑定和灵活的组件系统,其核心思想是 “数据驱动的...

  • Vue.js基础拾遗

    模版语法 插值 1、Vue.js的数据绑定形式是使用“Mustache”语法(双大括号)的形式,针对Html代码,...

  • VUE 基础知识(二)

    实例生命周期钩子 模版语法 插值 文本 数据绑定最常见的形式就是使用“Mustache”语法 (双大括号) 的文本...

  • 使用python让代码写代码

    让代码写代码挺有意思的,我们需要用到一个模版引擎 mustache。 python 用 chevron,安装如下:...

  • Flutter Dio网络请求

    Dart packages 网络请求使用dio.dart 数据解析使用json_serializable和json...

  • Vue基础教程之-模板语法和计算属性(三)

    一、模板语法 1.1 内容 Vue中的元素内容使用mustache模板引擎进行解析。https://github....

网友评论

      本文标题:2021-11-17 dart模版解析mustache

      本文链接:https://www.haomeiwen.com/subject/rzdrtrtx.html