您好,登錄后才能下訂單哦!
主頁面內容
<div class="layui-fluid layadmin-cmdlist-fluid"> <script id="demo2" type="text/html"> <div class="layui-col-md2 layui-col-sm4"> <div class="cmdlist-container"> <a lay-href="/books/add" rel="external nofollow" > <img src="{{ layui.setter.base }}style/res/template/portrait.png"> </a> <a href="javascript:;" rel="external nofollow" rel="external nofollow" > <div class="cmdlist-text"> <p class="info">新增</p> </div> </a> </div> </div> {{# layui.each(d.list, function(index, item){ }} <div class="layui-col-md2 layui-col-sm4"> <div class="cmdlist-container"> {{# if(item.cover_img == ""){ }} <a lay-href="/books/edit/bookId_edit={{ item.book_serial_num }}" rel="external nofollow" rel="external nofollow" > <img src="{{ layui.setter.base }}style/book/default.jpg"> </a> {{# } else { }} <a lay-href="/books/edit/bookId_edit={{ item.book_serial_num }}" rel="external nofollow" rel="external nofollow" > <img src="{{ item.cover_img }}"> </a> {{# } }} <a href="javascript:;" rel="external nofollow" rel="external nofollow" > <div class="cmdlist-text"> <p class="info">{{item.main_title}}</p> <div class="price"> <b>{{item.strSignStatus}}</b> </div> </div> </a> </div> </div> {{# }); }} {{# if(d.list.length === 0){ }} 無數據 {{# } }} </script> <div id="view" class="layui-row layui-col-space30"></div> </div>
發送ajax填充動態數據
var data = {} admin.req({ url: "/books/booklist" ,success: function(res){ data = res.data; var getTpl = demo2.innerHTML ,view = document.getElementById('view'); laytpl(getTpl).render(data, function(html){ view.innerHTML = html; }); } })
注:主頁面中a標簽的lay-href屬性 請求不刷新頁面 如果需要請求過去每次刷新頁面 需改成
<a href="./#/books/add" rel="external nofollow" >
前面加 ./#
以上這篇layuiAdmin循環遍歷展示商品圖片列表的方法就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持億速云。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。