uniapp开发实用技巧

CSS 变量

uni-app 提供内置 CSS 变量

CSS 变量	描述	App	小程序	H5
--status-bar-height	系统状态栏高度	系统状态栏高度、nvue 注意见下	25px	0
--window-top	内容区域距离顶部的距离	0	0	NavigationBar 的高度
--window-bottom	内容区域距离底部的距离	0	0	TabBar 的高度

路由拦截器

const navigateToInterceptor = {
  invoke(e) {
    // 在跳转前执行的逻辑
    console.log('跳转前');
  },
  success(e) {
    // 在跳转成功后执行的逻辑
    console.log('跳转成功');
  },
  fail(e) {
    // 在跳转失败时执行的逻辑
    console.log('跳转失败');
  },
  complete(e) {
    // 在跳转结束时执行的逻辑（不论成功或失败）
    console.log('跳转结束');
  }
}

// 添加全局拦截器
uni.addInterceptor('navigateTo', navigateToInterceptor)
uni.addInterceptor('reLaunch', navigateToInterceptor)
uni.addInterceptor('redirectTo', navigateToInterceptor)