uniapp页面跳转方式（【uni-app】点击左上角返回按钮，弹出弹窗或者是携带参数返回上一页）

目录

1    
    
    
    
  、弹出弹窗

2  


     


     


     


     
、把这一页的数据带回到上一页（获取下一页的数据 ）

3


 




 




 




 




、跳转页面并携带参数    
    
    
    
  ，接受页获取参数

1   

   

   

   

 、弹出弹窗

当我返回上一页的时候需要做一个判断是否需要保存

onBackPress 只支持APP和H5 但不支持小程序   


     


     


     


     
，可以用onUnload生命周期解决


 




 




 




 




，页面销毁的时候执行方法    
    
    
    
  。

注意：onBackPress和methods   

     

     

     

     、onLoad同级

data() { return { flag: true //是否弹出返回提示框 } }, onBackPress() { if (this.flag) { uni.showModal({ title: "确定退出编辑？", content: "退出后内容不做保存", success: (res) => { if (res.confirm) { // console.log("确定返回"); this.flag = false uni.navigateBack({ delta: 1, //返回层数   

   

   

   

 ，2则上上页 }) return true } else { this.flag = true // console.log("取消"); return true } } }) return true } else { return false } },

另一种写法

注意：不能写options.from === backbutton    

     

     

     

     ，因为 uni.navigateBack() 同样会触发 onBackPress 函数  


     


     


     


     
。因此在 onBackPress 中直接调用 uni.navigateBack() 并始终返回 true 会引发死循环


 




 




 




 




。 从而会导致重写 onBackPress 方法不生效的罪魁祸首



  




  




  




  




，然而也没有任何错误提示   

   

   

   

 。

onBackPress(options) { if (options.from === navigateBack) { return false } uni.navigateBack({ delta: 1 }) return true }

2



  




  




  




  




、把这一页的数据带回到上一页（获取下一页的数据 ）

第一页  


  


  


  


，点击下一步按钮到第二页

onShow() { let that = this uni.$on(update1, function(data) { that.damagePoint = data console.log(that.damagePoint) }) },

第二页    
     
     
     
     ，点击左上角的返回按钮




   




   




   




   



，携带数据到第一页

onBackPress(event) { uni.$emit(update1, this.damagePoint) },

3  


  


  


  


、跳转页面并携带参数 



 



 



 



，接受页获取参数

第一页                        ，跳转页面并携带参数（参数是对象）

methods: { change(item, index) { uni.navigateTo({ url: /pages/word/details?item= + JSON.stringify(item) }); } }

第二页




    




    




    




    


，接受参数

onLoad(e) { let item = JSON.parse(e.item) console.log(item) }