react-native this.props.navigation.goBack()的返回技巧

最新推荐文章于 2025-06-10 12:01:49 发布

原创最新推荐文章于 2025-06-10 12:01:49 发布 · 置顶 · 6.8k 阅读

CC 4.0 BY-SA版权

文章标签：

2 篇文章

订阅专栏

2 篇文章

订阅专栏

本文介绍了一种在移动端应用中实现页面跳转并确保数据能够正确刷新的方法。通过使用特定的导航函数和传递回调函数的方式，可以在用户完成登录或注册后返回到之前的页面，并触发该页面的数据更新。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

用户场景： 用户操作某一功能时，提示去登陆页面，从登陆页面跳到快速登录或者注册页面，快速登录或者注册完，需要跳回到用户原来操作浏览的页面

利用goback返回多个页面

登陆页面

_gotoScreen(screenName,params){

    const {navigate}=this.props.navigation;

    navigate(screenName,params);

}

this._gotoScreen('ForgetPassword',{gobackKey:this.props.navigation.state.key})

快速登录或者注册页面

this.props.navigation.goBack(this.props.navigation.state.params.gobackKey);

用户场景： 用户从我的评价列表拿到数据，传参数给下一页面，修改完编辑评论页面，发表修改后的评论 跳回到上一页面

处理goback返回上一页面而无法刷新数据的

const {navigate} = this.props.navigation;

navigate('ReviseComment', {params: item, callBackData: this._refresh});

//返回时执行上一页面的刷新数据方法

//执行上一页面的刷新数据方法

this.props.navigation.state.params.callBackData();

this.props.navigation.goBack();

注意事项：如果此页面是可从多个页面过来，就必须注意在需要的页面执行此操作，否则app会报错