zoukankan      html  css  js  c++  java
  • ajax请求数据填充表格———使用art-template模板提高效率

    一、为什么要用art-template模板

    在实习的一次项目中,因为需求中展示表格的字段有很多个,后端返回的也是json数据,这时候如果还是使用之前的字符串拼接,这样会开发得比较慢,而且容易出错,而且也不具有扩展性。
    因此,为了方便开发,我开始去查有没有简单的方法,发现了一个模板:art-template。这个模板是腾讯封装的,而且看了语法那些都比较简单,而且只有6kB.

    二、使用art-template模板实践

    因为涉及到公司的项目,这里就不贴代码了,我在网上看了一篇文章:https://www.jianshu.com/p/5f3b9600bbbe
    这里面说了常用的art-template模板的四个方法:

    • template(id,data)
    • template.compile(source,options):这个将source这个模板源代码编译成函数,这个方法会返回一个函数,如render(data),将data数据传入就会返回渲染结果html。
    • template.render(source,data,options):这个是将source模板源代码编译成函数并立即执行,返回渲染结果html
    • template.helper(name,callback):这个是添加辅助方法
      举例:
    //js代码中声明一个辅助函数
      template.helper('hi', function(name,age){
          console.log('你好! 我叫'+name);
          console.log('我今年'+age+'岁');
          //注意最后一定要返回一个结果给视图,否则这函数就没多大意义了
          return 'result';
      })
    

    辅助函数声明后模板中就可以进行调用了
    原生语法如下:

    <%=hi('高同学',23)%>
    

    如果辅助函数有多个参数::

    <%=hi('高同学',23,'value1','value2'..)%>
    

    简洁语法如下:

    {{value |hi:23}}
    

    如果辅助函数有多个参数:

    {{value | hi:'value1','value2'..)}}
    
  • 相关阅读:
    数据验证及文件操作
    Leecode336
    Leecode335
    正式回归
    自定义按钮的实现 windows phone
    asp.net中保存更改数据
    asp.net中可以这样序列化
    Asp.net mvc 3 实现进度条上传思路[转]
    server.MapPath
    Path.Combine (合并两个路径字符串)方法的一些使用细节
  • 原文地址:https://www.cnblogs.com/sminocence/p/9779496.html
Copyright © 2011-2022 走看看