diff --git a/pages/index/index.vue b/pages/index/index.vue index a31b65c..b8bfb35 100644 --- a/pages/index/index.vue +++ b/pages/index/index.vue @@ -5,6 +5,32 @@ + + + + + + + + + + + + + + + + + + + + + + + + 设备专属权益兑换 @@ -170,10 +196,58 @@ createTime: "", number: "", model: "", - recordList: [] + recordList: [], + // 图片数据 + imageList: [{ + url: 'https://picsum.photos/300/200?random=1', + alt: '图片1' + }, + { + url: 'https://picsum.photos/300/200?random=2', + alt: '图片2' + }, + { + url: 'https://picsum.photos/300/200?random=3', + alt: '图片3' + }, + { + url: 'https://picsum.photos/300/200?random=4', + alt: '图片4' + }, + { + url: 'https://picsum.photos/300/200?random=5', + alt: '图片5' + }, + { + url: 'https://picsum.photos/300/200?random=6', + alt: '图片6' + } + ], + scrollTimer: null, // 滚动定时器 + scrollSpeed: 1, // 滚动速度 (px/帧) + translateX: 0, // 位移量 + listWidth: 0, // 列表宽度 + isScrolling: false // 是否正在滚动 } }, + onReady() { + // 获取列表宽度 + this.$nextTick(() => { + const query = uni.createSelectorQuery().in(this); + query.select('.image-list').boundingClientRect(data => { + this.listWidth = data.width; + // 开始自动滚动 + this.startAutoScroll(); + }).exec(); + }); + }, + + onUnload() { + // 页面卸载时清除定时器 + this.stopAutoScroll(); + }, + methods: { request(url, method, data) { return new Promise((resolve, reject) => { @@ -448,13 +522,46 @@ } }); } + }, + + + // 开始自动滚动 + startAutoScroll() { + this.stopAutoScroll(); // 先清除已有定时器 + + // 每16ms滚动一次 (约60帧/秒) + this.scrollTimer = setInterval(() => { + this.translateX -= this.scrollSpeed; + + // 当滚动距离达到一个列表宽度时,重置位置实现无缝滚动 + if (Math.abs(this.translateX) >= this.listWidth) { + this.translateX = 0; + } + + this.isScrolling = true; + }, 16); + }, + + // 停止自动滚动 + stopAutoScroll() { + if (this.scrollTimer) { + clearInterval(this.scrollTimer); + this.scrollTimer = null; + this.isScrolling = false; + } + }, + + // 监听滚动事件 (用于鼠标悬停暂停) + onScroll() { + // 可以在这里处理手动滚动后的逻辑 } + } } - \ No newline at end of file diff --git a/unpackage/dist/dev/.sourcemap/mp-weixin/pages/index/index.js.map b/unpackage/dist/dev/.sourcemap/mp-weixin/pages/index/index.js.map index 600d6a9..c2dbde2 100644 --- a/unpackage/dist/dev/.sourcemap/mp-weixin/pages/index/index.js.map +++ b/unpackage/dist/dev/.sourcemap/mp-weixin/pages/index/index.js.map @@ -1 +1 @@ -{"version":3,"file":"index.js","sources":["pages/index/index.vue","../../../Software/HBuilderX.4.15.2024050802/HBuilderX/plugins/uniapp-cli-vite/uniPage:/cGFnZXMvaW5kZXgvaW5kZXgudnVl"],"sourcesContent":["