美文网首页react-native
react-native,下一级页面如何向上一级页面传递参数

react-native,下一级页面如何向上一级页面传递参数

作者: 康闹闹2013 | 来源:发表于2019-06-17 16:50 被阅读0次

需求背景:

从页面A跳转到月面B,当B中选择或者输入数据后,需要更新A的页面,并且返回到A页面。

有两种解决方法:

1、在A跳转到B的时候,传入回调函数作为参数:

A页面中代码:

NavigationManager.jump(this,PageName.B页面,{'keyword':this.state.keyword,'refresh':(bparam)=>{

console.log('打印B页面传过来的参数:',bparam);

    }})

这里跳转到B页面的时候,给B页面传入了一个参数refresh,这个refresh是个回调函数(接收一个参数bparam);

B页面中代码:

let params = NavigationManager.getParams(this);

param.refresh('我是B页面的参数');

这个时候可以看到,控制台打印出了:打印B页面传过来的参数: 我是B页面的参数。

通过上述过程,我们已经把B页面的参数传递给了上一级A页面,并且执行了A中的更新。

2、利用DeviceEventEmitter由B页面向A页面发通知

A页面中代码:

import { DeviceEventEmitter}from 'react-native';

componentWillMount(){

this.schemeSearchListner =DeviceEventEmitter.addListener(EventType.'你的消息名字,自定义', (data) => {

        this.setState({'keyword':data});

//做你收到消息后想做的事情

    });

}

//记得移除

componentWillUnmount(){

this.schemeSearchListner &&this.schemeSearchListner.remove();

}

B页面中代码:

//发送消息

DeviceEventEmitter.emit(EventType.'自定义的通知消息', this.state.content);

其中this.state.content是你要向A传递的参数,可以自由定义,这样就完成从B到上一级页面的参数传递。

相关文章

  • react-native,下一级页面如何向上一级页面传递参数

    需求背景: 从页面A跳转到月面B,当B中选择或者输入数据后,需要更新A的页面,并且返回到A页面。 有两种解决方法:...

  • 微信小程序之页面传递对象数组

    传递对象 传递数组 总结,向下一级页面传递对象或者数组的方式是相同的;先将要传递的参数通过JSON.stringi...

  • taro实战-微信小程序:路由传参

    taro官方文档关于路由传参的记载: 第一步:绑定要传递的参数 第二步:携带参数传递到下一级页面 第三步:下级页面...

  • 4.3 开发技巧:子页面更新父页面

    我们之前介绍的参数传递,是从父页面传递参数到子页面,子页面接收并显示。那如果子页面需要传递参数到父页面,该如何操作...

  • uniapp页面传值

    上一级页面传值下一级页面 A页面跳转方法里面 userInfo 为Object {'name':'张三','sex...

  • 2019-05-14 星期二 3 of 7

    本页面不显示导航栏,下一级页面显示导航栏的处理办法 原理:在页面即将出现的时候,隐藏导航栏,动画参数直接继承使用函...

  • vue 传值

    3、子组件-父组件2、父子件-子组件1、一级页面传递二级页面数据

  • Intent传递大量数据崩溃

    背景: 上一级的列表页, 需要选中几条或者多条或者全部列表, 然后将数据传递到下一级页面. 这是创建的Bean文件...

  • Flutter路由跳转及参数传递

    当需要向下一个页面传递参数时,要用到所谓的动态路由,自己生成页面对象,所以可以传递自己想要的参数。 新页面代码

  • 页面切换及参数传递

    页面切换及参数传递 在课程的大纲 通过组件a切换页面和传递参数 通过接口router切换页面和传递参数 接收参数 ...

网友评论

    本文标题:react-native,下一级页面如何向上一级页面传递参数

    本文链接:https://www.haomeiwen.com/subject/uitzfctx.html