uni自定义onBackPress事件

onBackPress函数return非true以外的值都会执行默认的返回行为,只有return true才不会执行返回事件,所以在执行自定义事件时一定要返回true

data() {
            return {
                isConfirm:false, //处理返回逻辑
            };
        },
methods:{
    onBackPress() {
            if(this.isConfirm == false)
            {
                uni.showModal({
                    content: '数据尚未保存,你确定要返回吗?',
                    success:  res => { // 一定要保证this的指向问题,否则会导致无限的弹出modal,可以考虑用that保存this指针或是使用箭头函数
                        if (res.confirm) 
                        {
                            this.isConfirm = true
                            uni.navigateBack() //navigateBack会再次执行onBackPress事件,所以在进入函数的时候我们加了isConfirm来判断是否执行自定义的事件
                        } 
                    }
                })
                return true
            }
            else
                return false
           }
}

值得一提的是这个函数不能使用async await,否则会导致弹出moadl后就没有后面的返回动作

//错误示例
data() {
            return {
                isConfirm:false, //处理返回逻辑
            };
        },
methods:{
    async onBackPress() {
            if(this.isConfirm == false)
            {
                let [,res]  = await uni.showModal({ content: '数据尚未保存,你确定要返回吗?})
                 if (res.confirm)
                 {
                        this.isConfirm = true
                        uni.navigateBack()
                        return true
                 }
                 else             
                    return false
            }
}

作者:扶不起的蝌蚪
链接:https://www.jianshu.com/p/2ccdc585e32e
来源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

posted @   风意不止  阅读(474)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· Manus爆火,是硬核还是营销?
· 终于写完轮子一部分:tcp代理 了,记录一下
· 别再用vector<bool>了!Google高级工程师:这可能是STL最大的设计失误
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· 单元测试从入门到精通
历史上的今天:
2020-10-05 tp5接口开发流程(思路版)
2020-10-05 mysql中主键和外键的作用,主表和从表如何区分,以及如何使用联合查询和TP5的联合查询
点击右上角即可分享
微信分享提示