转载

使用sodaRender构建简洁的前端模板

SodaRender

SodaRender是一款具有类似Angular模板写法的模板引擎,使用SodaRender模板引擎会带来更直观的优点:

  • 轻量,代码少
  • 模板清晰,可读性强
  • 防止意外的XSS
  • 防止因cgi字段丢失导致的错误

使用SodaRender

假如你还在使用JS和模板混杂的前端模板引擎,在它不至于使你的模板变得一团遭的时候,它们看起来是这样的

<% for(var i = 0; i < data.length; i ++){    var item = data[i]; %>
  • <%=item.name%>
  • <

    % } %>

    在使用sodaRender重构之后,你的代码看起来是这样的

  • {{item.name}}
  • 如果你还想继续为一大堆的%噩梦所揪挠,那你的模板可能看起来是这样的

    <%=item.name%>

    如果你希望更简洁的阅读,你可能会选择sodaRender

    {{item.name}}

    如果还想在你的模板中混合函数,那么你的模板会更糟糕,如下

    <% for(var i = 0; i < data.length; i ++){    var item = data[i];    var formatTime = function(time){        if(item < + new Date()){        }else{          // .....        }    } %>
  • <%=formatTime(item.time)%>
  • <

    % } %>

    这样几乎要把后来的人逼疯了,这时候如果考虑sodaRender

  • {{item.time|formatTime}}
  • 如果你希望改善你的模板中的这些状况,或者你不幸被我说中了,那么请移步这里吧 SodaRender

    正文到此结束
    Loading...