uni-app知识点:禁止页面返回及如何实现自定义返回逻辑、实现再次返回退出应用时不退出应用而是在后台运行、uni-app ios滑动时卡顿不流畅问题解决方案

一、禁止页面返回

  在uni中页面的生命周期有一个 onBackPress ,只要知道这个生命周期怎么使用就可以运用了,只需要在 当前页面 加上 return true,就可以阻止当前页面返回。起初我想当然的以为是return false像阻止默认事件那样,结果一直没有效果。

onBackPress(options) {
    ...
    return true
}

  这里有一个自定义返回教程写的不错,可以参考:uni-app自定义返回逻辑教程:https://ask.dcloud.net.cn/article/35120

  还有比如实现连点2次退出应用

复制代码
data() {
    return {
        backButtonPress:0,    //连点2次退出应用计时
    }
},

onBackPress(options) {  
  this.backButtonPress++;
  if (this.backButtonPress > 1) { 
    plus.runtime.quit();
  } else {
    plus.nativeUI.toast('再按一次退出应用');
  } 
  setTimeout(function() {
    this.backButtonPress = 0;
  }, 1000);
  return true;
},
复制代码

二、uni-app实现再次返回退出应用时不退出应用而是在后台运行

  如果APP需要后台驻留,用户返回到首页时会提示退出操作,我们可以不退出而是隐藏至后台,这样的话APP就会在后台运行,以下代码须写在main.js里面,弹出的内容可自定义设置。

复制代码
let main = plus.android.runtimeMainActivity();
//为了防止快速点按返回键导致程序退出,所以重写quit方法改为隐藏至后台  
plus.runtime.quit = function() {
    main.moveTaskToBack(false);
};
//重写toast方法如果内容为 ‘再次返回退出应用’ 就隐藏应用,其他正常toast 
plus.nativeUI.toast = (function(str) {
    if (str =='再次返回退出应用') {
        plus.runtime.quit();
    } else {
        uni.showToast({
            title: '再次返回退出应用',
            icon: 'none'
        })
    }
});
复制代码

三、uni-app ios滑动时卡顿不流畅问题解决方案

1、将scroll-view 改为view使用overflow属性。

2、将整个vue页面添加position:fixed;z-index:10;脱离页面的ios自带的滚动。

3、将单独需要滚动的地方设置position:fiexd;z-index:10;

posted @   古兰精  阅读(7664)  评论(0编辑  收藏  举报
编辑推荐:
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
阅读排行:
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· 单元测试从入门到精通
· 【硬核科普】Trae如何「偷看」你的代码?零基础破解AI编程运行原理
· 上周热点回顾(3.3-3.9)
· winform 绘制太阳,地球,月球 运作规律
点击右上角即可分享
微信分享提示