目录常见bug解决页面刷新后无法返回上一页面安卓机滚动条不隐藏隐藏vue中普通元素的滚动条webSocket超出次数其它功能css获取底部安全栏高度小程序自动刷新当前页面获取状态栏、胶囊高度自定义导航栏input传参、函数传默认参和自定义参点击查看位置地图map组件批量获取元素信息并滚动至其位置页面滚动至某class的位置并再多滚动部分距离h5跳转其它网页上传文件请求封装背景部分渐变加默认背景色uni小程序中用户权限打开提示将map地图中心移动为某点为中心常见bug解决页面刷新后无法返回上一页面history.back() 导航到浏览器的其他历史记录letcanNavBackgetCurrentPages()if(canNavBackcanNavBack.length1){uni.navigateBack()}else{history.back();}安卓机滚动条不隐藏此时苹果机滚动条隐藏但安卓机滚动条不隐藏!-- show-scrollbar控制是否出现滚动条 --scroll-viewclasstag-scrollscroll-xtrue:show-scrollbarfalse.../scroll-view需要使用 CSS 隐藏滚动条::v-deep .tag-scroll ::-webkit-scrollbar{display:none!important;width:0!important;height:0!important;color:transparent!important;}隐藏vue中普通元素的滚动条滚动的元素{::-webkit-scrollbar{display:none!important;width:0!important;height:0!important;color:transparent!important;}}webSocket超出次数重点是使用uni.closeSocket()来释放缓存if(this.socketTask){this.socketTask.close({code:1000,reason:主动关闭,success:(res){setTimeout((){uni.closeSocket();//释放资源到连接池避免僵尸数据},100);console.log(res,beforeDestroy 关掉了socet》);},fail:(err){console.log(err,错误信息000);}})}其它功能css获取底部安全栏高度bottom:env(safe-area-inset-bottom);小程序自动刷新当前页面letpagesgetCurrentPages();constcurPagepages[pages.length-1]uni.redirectTo({url:curPage.$page.fullPath})获取状态栏、胶囊高度自定义导航栏相关API获取小程序胶囊信息conststatusBarHeightuni.getSystemInfoSync().statusBarHeight;//状态栏高度lettitleBarHeight0;//导航栏标题高度// #ifdef MP 小程序const{top,height}uni.getMenuButtonBoundingClientRect()titleBarHeight(top-statusBarHeight)*2height// #endif// #ifdef H5titleBarHeightstatusBarHeight45// #endifinput传参、函数传默认参和自定义参使用 $event 代替默认参数的位置input组件既要获取事件默认回调又要获取调用事件传参!-- html --inputv-modelvaluechangechange($event,111)/input//jschange(res,val){console.log(res,回调参数)console.log(val,参数)}点击查看位置点击查看 uniapp官方文档uni.openLocation({latitude:this.latitude,longitude:this.longitude,name:this.address,success:function(){console.log(success)},fail(err){console.log(err,err)}})地图map组件点击查看 uniapp官方文档mapstylewidth:100%;height:500rpx;:scale16markertapmarkerClickcallouttapmarkerClickclassmap:enable-3Dtrue:show-locationtrue:enable-rotatetrue:latitudeinfo.store.latitude:longitudeinfo.store.longitude:markersmarkers/map批量获取元素信息并滚动至其位置商品分类tab列表viewviewv-for(item,index) in lessonCateList:keyindextapclickLessonCate(item)text{{item.name}}/text/view/view点击某个分类由于我的是自定义导航栏所以需要减去其高度functionclickLessonCate(item){constscrollTopitem.top-(statusBarHeighttitleBarHeight)uni.pageScrollTo({scrollTop})}批量记录各个分类元素的位置onReady((){setTimeout((){lessonCateList.value.forEach((k,i){uni.createSelectorQuery().select(.lessonCate${k.id}).boundingClientRect((rect){lessonCateList.value[i].toprect.top}).exec();})},1000)})页面滚动至某class的位置并再多滚动部分距离使用offsetTop添加距离uni.pageScrollTo({selector:.employee_list .employeeItem${id},offsetTop:-453,duration:300})h5跳转其它网页html跳转uni-link:showUnderLinefalsehrefhttp...跳转/uni-linkjs跳转window.location.hrefhttp...上传文件请求封装点击查看uni.uploadFile官方文档//域名constapiUrlhttp://abc.com/** * desc 上传图片 * param filePath * param token * */exportconstuploadApi({filePath,token}){returnnewPromise((resolve,reject){uni.uploadFile({url:apiUrl/common/upload,filePath,name:file,header:{token},success:(res){if(res.statusCode200res.statusCode300){constdataJSON.parse(res.data)resolve(data)}else{reject(res)}},fail:(err){reject(err)}})})}背景部分渐变加默认背景色例如templateviewclasstoolPackageIndexnaviComnaviTitle场景化工具包/naviCom!-- 正文 --/view/templatestyle langscss scoped page{background:#f9ffd8;}.toolPackageIndex{background-image:linear-gradient(1deg,#f9ffd8,#efffb8);background-size:100% 400rpx;background-repeat:no-repeat;min-height:400rpx;}/styleuni小程序中用户权限打开提示以地理位置权限为例uni.getSetting({success:(res){varstatusres.authSetting;if(!status[scope.userLocation]){// 如果授权信息中没有地理位置的授权则需要弹窗提示用户需要授权地理信息uni.showModal({title:是否授权当前位置,content:需要获取您的地理位置请确认授权否则打卡功能将无法使用,success:(tip){if(tip.confirm){// 如果用户同意授权地理信息则打开授权设置页面判断用户的操作uni.openSetting({success:(data){// 如果用户授权了地理信息在则提示授权成功if(data.authSetting[scope.userLocation]true){uni.showToast({title:授权成功,icon:success,duration:1000})// 授权成功后然后再次chooseLocation获取信息uni.chooseLocation({success:(res){// 将获取到的地址信息存储this.addressres.address}})}else{uni.showToast({title:授权失败,icon:none,duration:1000})}}})}}})}},fail:(res){uni.showToast({title:调用授权窗口失败,icon:none,duration:1000})}})将map地图中心移动为某点为中心uni.createMapContext( [map元素id] , [map元素ref] )点击查看uni.createMapContext官方文档uni.createMapContext(map,mapRef).moveToLocation({latitude:Number(latitude),longitude:Number(longitude)})