1,首先前后端分离用到了3个插件

HTML轮播图实现(前后端分离)

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>

 

相关文章:

  • 2021-06-12
  • 2022-01-21
  • 2022-12-23
  • 2021-11-07
  • 2021-12-05
  • 2022-12-23
  • 2021-08-25
猜你喜欢
  • 2022-12-23
  • 2022-01-11
  • 2021-05-07
  • 2021-05-12
  • 2022-12-23
  • 2021-04-19
相关资源
相似解决方案