1,首先前后端分離用到了3個插件
2,異步請求后端獲取數據庫圖片地址(圖片名字)
//圖片輪播 axios({ url:'http://127.0.0.1:8000/userctrl/image', method:'get', responseType:"json", }) .then(function(obj){ let list = obj.data for(var i=0;i<list.length;i++){ $("#tuu"+[i]).attr('src','http://127.0.0.1:8000/upload/'+list[i]['fields']['img']) } })
**后端過程略過
3,模板渲染部分
<ul class="slide" > <li><a><img src="" id="tuu0"></a></li> <li><a><img src="" id="tuu1"></a></li> <li><a><img src="" id="tuu2"></a></li> <li><a><img src="" id="tuu3"></a></li> </ul>