轮播图 vue
轮播图
业务
1、点击左右箭头图标,实现图片切换
2、点击底部小圆点时,可切换对应顺序的图片,同时该小圆点高亮
3、实现自动播放(定时器)
4、当鼠标悬停在图片上时,停止自动播放(关闭定时器)
5、当鼠标离开图片时,开启自动播放(开启定时器)
6、组件被销毁时,清除定时器
html
1、结构 ul 包裹 li, li 里通过 router-link 包裹 img
2、调用后端接口请求数据对 li 进行 v-for 循环遍历
3、左右两侧的箭头图标,通过 a 标签,包裹 i 标
原创
2021-08-21 23:18:20 ·
356 阅读 ·
0 评论