art-template使用

1. 渲染单个对象数据

  1. 回调函数中设置渲染对象

const stionStr = template("script的id", {list: ele});
$(".info").html(stionStr);

  2. 在script中定义模板

<script type="text/html" id="topboxInfo" >
        <h6 class="title">{{ list.name}}</h6>
        <div class="fz">直流桩:6    直流桩:6</div>
        <div class="sm">
            <span class="kx"><em>空闲:</em><i>{{ list.stat.idle }}</i><i>/</i>{{list.stat.total}}</span>
            <span class="kx fr"><em>故障:</em><i>0</i></span>
        </div>
        <div class="box">
            <li class="address">{{list.address}}</li>
            <li class="tel">0571-88668630</li>
            <li class="time">周一至周日 24:00-00:00</li>
        </div>   
    </script>

2. 遍历数组

  

const htmlStrT = template("botboxList", {list : res.chargers});
$(".botbox .list").html(htmlStrT);

  

{{ each list curr index }}
        <li>
            <h6 class="title">{{curr.name}}</h6>
            <div class="fz">地址:{{curr.address}}</div>
        </li>
{{ /each }}

  

原文地址:https://www.cnblogs.com/xhrr/p/11224040.html