初识thymeleaf

近期,大哥说要用一个新的模板来写页面,他说现在spring推荐thymeleaf模板,好嘛,从jsp的坑跳到thymeleaf的坑,好吧,开始上手。有了自己封装jsp的路子,thymeleaf也就那么回事,话说这模式和以前的jsp一样啊喂。这分明就是spring推销自己的模板好不好。但是大哥说话不得不从。(话说前几天说好的用velocity呢,有不用啦,哎~~~~~~)

让我们来说一说thymeleaf无非还是一个后天引擎模板,用来同步渲染数据 ,同过对一个后台模板的应用与对两个后台模板的了解,我发现对于前端来说,用这些后台模板来写页面,永远达不到前后端分离的作用,只用用现在风生水起的前端框架才能挑起前后端的大梁,而且针对于前端框架,各种服务于前端框架的技术层出不穷。以vue来举例,通过看vue官网的文档,你就能很快的上手了解和应用vue,并且个人是比较喜欢vue的风格的。借着es6(现在都es7,es8了)的各种超级精简的代码风格,让vue无论是代码和风格上来说都一股清新简洁之风。

咳咳~~,有点跑题,我这里不是来比较后台框架和前端框架的,下面我们就说一说thymeleaf引擎:

以下是thymeleaf模板的循环,其实个人感觉无论是前端还是后台的模板引擎他们的数据渲染偶读差不多,所以用起来和看起来问题不大

<tr th:each="prod : ${prods}" th:class="${prodStat.odd}? 'odd'">    //  在最外层来以空格循环,得到循环的值,并命名为pords(这里的$(prods)和jsp的一样哈)

    <td th:text="${prod.name}">Onions</td>           //文本值用特用的语法th:text来描述

    <td th:text="${prod.price}">2.41</td>

    <td th:text="${prod.inStock}? #{true} : #{false}">yes</td>   //  同时也有用的特别爽的三元运算符

    <td>

      <span th:text="${#lists.size(prod.comments)}">2</span> comment/s

      <a href="comments.html" 

         th:href="@{/product/comments(prodId=${prod.id})}"           // 有关于路径的取法

         th:if="${not #lists.isEmpty(prod.comments)}">view</a>      //内置的if标签语法

    </td>

  </tr>

 

 

关于th:utext和th:text的比较

      th:text是纯文本th:utext可以识别标签,像是“welcome to <b>${country}</b>

   以下是摘抄thymeleaf官方文档的语法:

  • 变量表达式: ${...}
  • 选择变量表达式: *{...}
  • 消息表达式: #{...}
  • 链接URL表达式: @{...}
  • 片段表达式: ~{...}
  • #ctx:上下文对象。
  • #vars: 上下文变量。
  • #locale:上下文语言环境。
  • #request:(只在Web上下文中)HttpServletRequest对象。
  • #response:(只在Web上下文中)HttpServletResponse对象。
  • #session:(只在Web上下文中)HttpSession对象。
  • #servletContext:(只在Web上下文中)ServletContext对象。

对于一个项目来说一个好的架构是必不可少的,但是做出一个能够长期维护的而且别人能够看得懂的代码及代码架构 是非常的困难的,既然我们不能做到每一行代码都是自己写的,那么基于一个功能完善,架构清晰的框架或者模板是前提。之后需要前后台人员彼此合作,制定共同的标准来实行。这样我们的代码能最基本的在一个最基本的环境中运行起来。

关于这个框架,大哥又说先放一下,,,,所有关于此框架的深入学习待下一篇文章在来详细的描述。

posted @ 2018-01-17 23:58  kimsaerono  阅读(345)  评论(0编辑  收藏  举报