角4. x + Ionic3踩坑之Ionic3。x流行反向传值详解

　　


　　

　　

关于正向传值,上一篇文章里面有讲,具体可以看这里:https://www.jb51.net/article/136302.htm

　　

　　

,,,,1 .利用ES6提供承诺对象

　　

,,,,2利用Ionic3.x提供事件对象,观察者模式(发布/订阅)

　　

<强> 1)利用ES6提供承诺对象
　　

　　

这边假设有两个页面一页面,B页面,情景如下,一个跳页转B面,在B页面返回一页面需要给一个页面选回的值。
　　

　　

页面代码
　　

　　

html内容
　　

　　 　　 　　& lt;按钮(tap)=" goToBPage()”在跳转到B页面& lt;/button> 　　 　　

ts内容:
　　

　　 　　 　　从“进口BPage。/BPage ' 　　出口类APage { 　　构造函数(公共navCtrl: NavController、公共navParams: navParams) { 　　}//用于流行回调的块 　　callBackFromB=(params)=比;{ 　　返回新的承诺((解决,拒绝)=比;{ 　　如果(params) { 　　解决(“成功取到B页面返回的参数”); 　　控制台。日志(" B页面参数为:' + params); 　　其他}{ 　　拒绝(“取回B页面数据失败”) 　　} 　　})； 　　} 　　goToBPage () { 　　this.navCtrl。推动(BPage, { 　　回调:this.callBackFromB 　　}） 　　} 　　} 　　 　　

备注:承诺是由Es6提供的一个对象,新的一个对象,有两个回调函数,一个是resove,一个是拒绝,resove是执行成功的回调,也就是我们调用然后执行的方法,拒绝是执行失败的回调,对应是调用抓方法,现在es7新出一异步和等待,异步是对承诺的进一步封装,详情可具体看官方文档!
　　

　　

B页面代码
　　

　　

ts内容:
　　

　　 　　 　　构造函数(公共navCtrl: NavController、公共navParams: navParams) {//获取对面一个传过来的回调方法 　　这一点。回调=this.navParams.get(“回调”) 　　 　　} 　　返回(){ 　　让参数='我是要给一个页面数据的 　　this.callback(参数),然后(()=祝辞{//流行返回方法 　　this.navCtrl.pop (); 　　})； 　　} 　　 　　

1)利用Ionic3.x提供事件对象,观察者模式(发布/订阅)
　　

　　

<强>事件对象主要有3个方法

　　

1。发布发布(话题,eventData)

　　

'参数一是发布事件名字,第二个参数就是要发送数据,其实还可以传送第三,第四……等,都是可以传送数据的

　　

2。订阅订阅(主题,处理程序)

　　

参数一是要接收的事件铝管,第二个参数代表发布时传送的参数,如果发布有传第三个参数,同样的订阅的第三个参数就是对应的发布的第三个参数,以此类推....”

　　

3。取消订阅退订(主题,处理程序)

　　

参数一是要取消订阅的事件的名称,第二是一个回调函数,返回值:如果被移除成功,返回真正的
　　实现反向传值代码如下
　　

　　

页面代码
　　

　　

ts代码
　　

　　 　　 　　goToBPage () { 　　this.events。订阅(“bevents”(params)=比;{//接收B页面发布的数据 　　控制台。日志(“接收数据为:“+ paramsVar);//取消订阅 　　this.events.unsubscribe (“bevents”); 　　}） 　　this.navCtrl.push (BPage); 　　} 　　 　　

B页面代码
　　

　　

ts代码
　　

　　 　　 　　返回(){ 　　this.navCtrl.pop(),然后(()=比;{//发布bevents事件 　　this.events。发布(“bevents”、“我是B页面数据的); 　　})； 　　} 　　 　　


　　

　　

以上主要介绍反向传值的2种方法,当然还有其它方法,如果你有更好的方法,欢迎留言讨论,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对的支持。

角4. x + Ionic3踩坑之Ionic3。x流行反向传值详解