// components/loading/index.js Component({ /** * 组件的属性列表 */ properties: { }, /** * 组件的初始数据 */ data: { progress: 0, progressText: 0, showProgressBar: true, showLogo: false, showExploreButton: false }, /** * 组件的方法列表 */ methods: { // 点击"开始探索"按钮 goToIndexPage() { console.log(111111) // 触发自定义事件,通知父组件 this.triggerEvent('startexplore'); // 设置已访问标记 wx.setStorageSync('hasVisited', true); }, // 开始进度条动画 startProgress() { const duration = 3000; // 3秒 const interval = 30; // 每30ms更新一次 const steps = duration / interval; const increment = 100 / steps; const timer = setInterval(() => { let currentProgress = this.data.progress + increment; if (currentProgress >= 100) { clearInterval(timer); currentProgress = 100; this.setData({ progress: currentProgress, progressText: Math.floor(currentProgress) }); // 进度条完成后,延迟显示logo setTimeout(() => { this.setData({ showProgressBar: false, showLogo: true }); // logo显示2秒后,显示"开始探索"按钮 setTimeout(() => { this.setData({ showExploreButton: true }); }, 2000); }, 500); } else { this.setData({ progress: currentProgress, progressText: Math.floor(currentProgress) }); } }, interval); } }, /** * 组件生命周期 */ lifetimes: { attached() { // 组件实例进入页面节点树时执行 this.startProgress(); } } });