React Native回退后刷新界面

本文介绍了在React Native中如何实现页面回退时刷新界面的两种方法:一是通过回调函数,当从B页面返回A页面时调用A页面的初始化方法;二是利用DeviceEventEmitter监听事件,在多个页面回退时触发数据刷新。
摘要由CSDN通过智能技术生成

1、如果是使用goback返回刷新,也就是返回上一级页面后刷新页面,这时可以使用回调方法。

例如:从A跳到B再回到A,

A页面定义回调方法,

this.props.navigation.navigate("B", {
    id: this.state.id,
    refresh: function () {
        this.init();
    }
});
B页面返回时调用,

<TouchableOpacity  onPress={() => {
    this.props.navigation.state.params.refresh();
    this.props.navigation.goBack();
}}>
    <Text>返回</Text>
</TouchableOpacity>
2,从多个页面返回刷新

import {DeviceEventEmitter} from 'react-native';

//...

import  {DeviceEventEmitter} from 'react-native';
//...
componentDidMount() {
        this.subscription = DeviceEventEmitter.addListener('Key', this.refreshData)
    };
    refreshData(data) {
        this.setState({
            data

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值