future
82 lines
1.6 KiB
Vue
82 lines
1.6 KiB
Vue
<!-- App.vue -->
|
|
<script>
|
|
export default {
|
|
onLaunch: function() {
|
|
console.log('App Launch')
|
|
this.preloadTabData()
|
|
},
|
|
onShow: function() {
|
|
console.log('App Show')
|
|
},
|
|
onHide: function() {
|
|
console.log('App Hide')
|
|
},
|
|
methods: {
|
|
// 预加载所有 Tab 页面的核心数据
|
|
preloadTabData() {
|
|
// 延迟执行，不阻塞首屏
|
|
setTimeout(() => {
|
|
// 预加载课程数据
|
|
// #ifdef MP-WEIXIN
|
|
// 小程序端预请求数据
|
|
uni.request({
|
|
url: '/api/course/recommend',
|
|
method: 'GET',
|
|
success: (res) => {
|
|
uni.setStorageSync('course_cache', {
|
|
data: res.data,
|
|
time: Date.now()
|
|
})
|
|
}
|
|
})
|
|
// #endif
|
|
|
|
// 预加载训练数据
|
|
|
|
}, 1000)
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
@import 'common/style/base.css';
|
|
|
|
/* 全局骨架屏样式 */
|
|
.skeleton {
|
|
background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
|
|
background-size: 200% 100%;
|
|
animation: skeleton-loading 1.5s infinite;
|
|
}
|
|
|
|
@keyframes skeleton-loading {
|
|
0% { background-position: 200% 0; }
|
|
100% { background-position: -200% 0; }
|
|
}
|
|
|
|
/* 页面切换动画 */
|
|
.page-enter-active,
|
|
.page-leave-active {
|
|
transition: opacity 0.2s ease, transform 0.2s ease;
|
|
}
|
|
|
|
.page-enter-from {
|
|
opacity: 0;
|
|
transform: translateX(30rpx);
|
|
}
|
|
|
|
.page-leave-to {
|
|
opacity: 0;
|
|
transform: translateX(-30rpx);
|
|
}
|
|
|
|
.app-container {
|
|
width: 100%;
|
|
min-height: 100vh;
|
|
max-width: 430px;
|
|
margin: 0 auto;
|
|
background-color: var(--bg-light);
|
|
position: relative;
|
|
overflow-x: hidden;
|
|
}
|
|
</style> |