React Native开发指南React Native开发React Native开发经验集

react-native-router-flux(一)页面跳转与

2017-10-17  本文已影响191人  Charon_Pluto

1.页面跳转

  • Actions.ACTION_NAME();//只做页面跳转
  • Actions.ACTION_NAME({key:value});//页面跳转并且进行数据的传递 键key和值value
    接受的时候用this.props.key
  • Actions.refresh({key:value}) // 用于刷新当前页面的属性,即接受传递的参数

2.页面的回跳

  • Actions.pop(); //返回上一页面,不带参数
  • Actions.pop({refresh:({key:value})}) //返回上一页面,带参数
  • Actions.pop( {popNum: 2}); //指定回退页面数
  • Actions.pop({popNum:2, refresh:({key:value})}) //指定回退页面数,带参数
  • Actions.popTo(“ACTION_NAME”) //返回指定页面

refresh是框架自带函数,可用于刷新属性(props)

如需要在指定页面刷新数据:需要加上

 componentWillReceiveProps(nextProps) {
        // 假设前一个页面传递过来一个名字叫做isRefresh的布尔型参数
        console.warn(JSON.stringify(nextProps))
       //需要刷新的数据可以做
        console.warn("userName"+nextProps.key)
        this.state.key=nextProps.key;
        this.forceUpdate();
    }

3.回跳上一个页面,调用函数做相应操作

上一个页面点击事件

handlerClick(){
        Actions.ACTION_NAME({callBack:this.callBack.bind(this)});
    }
 callBack(){
        console.warn("回跳上一个页面,调用函数做相应操作")
    }

下一个页面进行方法的调用

   Actions.pop(this.props.callBack())
上一篇下一篇

猜你喜欢

热点阅读