react native界面传参和方法回调

界面传参数用到Navigator(下面用Nav代替)
一,A界面->B界面,既A传个ID到B。
Nav 有个属性renderScene 回调方法有两个参数route和navigator。
A界面:

 <Navigator ref='navigator' 
             initialRoute={{ name:'login' , component: defaultComponent }}    
             configureScene={() => {return Navigator.SceneConfigs.FloatFromRight;}}      
             renderScene={(route, navigator) => {let Component = route.component;      
             if(route.component) {    
     return <Component {...route.params} navigator={navigator} route={route} />}        
}}/>

//注释
initialRoute为默认的名字和界面。
configureScene 跳转动画
{...route.params} 将params这个对象属性打开,类似遍历后变成key value键值对只不过会在props中
之后 只要写

const {navigator}=this.props;
if (navigator) {
     navigator.push({name:'BookStore',   
     component: BookStore,      
     params: { ID:'可以了'}   
 });}

//注释
name 就是定义的名字,
component 为B界面的引用
params 为传的参数 '可以了'
下个界面用this.props.ID
B界面:

constructor(props){
       super (props)
       console.log(this.props.ID)
}

二,方法回掉
比如说A界面push到B界面处理完数据点击重新刷新A界面。
A界面:

const {navigator}=this.props;
if (navigator) {
     navigator.push({name:'BookStore',   
     component: BookStore,      
     params: {loadAView:()=>this._loadView()}   
 });}
_loadView() {
           '处理数据'
}

B界面
点击调用

if (this.props.loadAView) {
       if (this.props.loadAView('你的参数可以不带参数'))
}

这时候返回过去就会刷新A界面了。

参考老大方法,加深了认识。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容