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

作者: Charon_Pluto | 来源:发表于2017-10-17 14:39 被阅读191次

    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())
    

    相关文章

      网友评论

        本文标题:react-native-router-flux(一)页面跳转与

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