使用lodash替换js字符串中的变量

小鱼儿 2023-09-28 18:04 112阅读 0赞

![在这里插入图片描述][e1bef24e6a114b7e915fefa8e187a095.png]

// 使用 "interpolate" 分隔符创建编译模板
    var compiled = _.template('hello <%= user %>!');
    compiled({
         'user': 'fred' });
    // => 'hello fred!'
     
    // 使用 HTML "escape" 转义数据的值
    var compiled = _.template('<b><%- value %></b>');
    compiled({
         'value': '<script>' });
    // => '<b><script></b>'
     
    // 使用 "evaluate" 分隔符执行 JavaScript 和 生成HTML代码
    var compiled = _.template('<% _.forEach(users, function(user) { %><li><%- user %></li><% }); %>');
    compiled({
         'users': ['fred', 'barney'] });
    // => '<li>fred</li><li>barney</li>'
     
    // 在 "evaluate" 分隔符中使用内部的 `print` 函数
    var compiled = _.template('<% print("hello " + user); %>!');
    compiled({
         'user': 'barney' });
    // => 'hello barney!'
     
    // 使用 ES 分隔符代替默认的 "interpolate" 分隔符
    var compiled = _.template('hello ${ user }!');
    compiled({
         'user': 'pebbles' });
    // => 'hello pebbles!'
     
    // 使用自定义的模板分隔符
    _.templateSettings.interpolate = /{
         {([\s\S]+?)}}/g;
    var compiled = _.template('hello {
        { user }}!');
    compiled({
         'user': 'mustache' });
    // => 'hello mustache!'
     
    // 使用反斜杠符号作为纯文本处理
    var compiled = _.template('<%= "\\<%- value %\\>" %>');
    compiled({
         'value': 'ignored' });
    // => '<%- value %>'
     
    // 使用 `imports` 选项导入 `jq` 作为 `jQuery` 的别名
    var text = '<% jq.each(users, function(user) { %><li><%- user %></li><% }); %>';
    var compiled = _.template(text, {
         'imports': {
         'jq': jQuery } });
    compiled({
         'users': ['fred', 'barney'] });
    // => '<li>fred</li><li>barney</li>'
     
    // 使用 `sourceURL` 选项指定模板的来源URL
    var compiled = _.template('hello <%= user %>!', {
         'sourceURL': '/basic/greeting.jst' });
    compiled(data);
    // => 在开发工具的 Sources 选项卡 或 Resources 面板中找到 "greeting.jst"
     
    // 使用 `variable` 选项确保在编译模板中不声明变量
    var compiled = _.template('hi <%= data.user %>!', {
         'variable': 'data' });
    compiled.source;
    // => function(data) {
        
    //   var __t, __p = '';
    //   __p += 'hi ' + ((__t = ( data.user )) == null ? '' : __t) + '!';
    //   return __p;
    // }
     
    // 使用 `source` 特性内联编译模板
    // 便以查看行号、错误信息、堆栈
    fs.writeFileSync(path.join(cwd, 'jst.js'), '\
      var JST = {\
        "main": ' + _.template(mainText).source + '\
      };\
    ');

参考链接：  
[https://www.lodashjs.com/docs/lodash.template][https_www.lodashjs.com_docs_lodash.template]

[e1bef24e6a114b7e915fefa8e187a095.png]: https://img-blog.csdnimg.cn/e1bef24e6a114b7e915fefa8e187a095.png
[https_www.lodashjs.com_docs_lodash.template]: https://www.lodashjs.com/docs/lodash.template