huanggr
问题描述
在项目中，我们经常会遇见新增表单的情况，如登录注册、列表项新增，那么在这种情况下，如果我们用常用的push来跳转页面，在新增完后，如果跳转到新增前页面，就会有返回箭头，按手机返回键也会导致页面回到新增表单页，这样用户体验很不好，解决的办法是用，modal组件和ViewController组件来完成这种操作
解决办法
1.跳转前页面
引入modal组件
1 2 3 | import {ModalController} from 'ionic-angular'; constructor（public modalCtrl: ModalController）{} |
跳转到表单添加页面
1 2 3 4 5 6 7 8 9 10 11 | gotoLeaveAddPage() { let modal = this.modalCtrl.create('LeaveAddComponent',{ leave:this.leave }); modal.onDidDismiss(data => { //核心功能，在这里刷新，即重新查一遍即可 console.log(data); }); modal.present(); } |
LeaveAddComponent是跳转页面路径
leave是传输数据
这里的重点是onDidDismiss()方法，通过这个方法，可以拿到跳转后的页面传过来的数据，怎么传数据下面会讲。
2.跳转后页面
1 2 3 4 5 6 7 8 9 10 | 引入ViewController组件 import {ViewController} from 'ionic-angular'; constructor（public viewCtrl: ViewController）{} 使用dismiss()方法关闭页面，并传输数据 this.viewCtrl.dismiss({ 'danyuan_id': this.danyuan_id, }) |
数据传输后，通过跳转前页面的，onDidDismiss()方法接收数据，并且在该方法内重新加载一次接口即可刷新数据。这样按返回就不会跳到表单页。
7