您的位置: 首页 > 文章 > vue商城项目开发:底部导航样式、顶部导航矩阵和轮播图 vue商城项目开发:底部导航样式、顶部导航矩阵和轮播图 分类: 文章 • 2023-10-11 22:45:55 底部导航样式修改 第一步: 第二步: 顶部导航矩阵 v-for取代多次复制 字体图标动态传入 动态绑定样式 添加8个 {{}}和{}的区别 {{}}: 不带任何符号: {}: 首页轮播图 准备图片数组: v-for:下面这种写法图片是无法显示出来的 加上require: 展示下标为指定值的图片: 索引轮播图的实现思路就是:动态改变n的值,让其每隔1秒钟就+1.就实现了轮播的效果了 查看效果: 定时器的清除 当切换到其他页面时,当前页面的定时器应该将其清除掉。 先定义一个定时器属性: 组件destroyed销毁时调用定时器的清除方法: 轮播点的显示: