欢迎光临
我们一直在努力

react native按返回提示再按一次退出应用

react native按返回提示再按一次退出应用

首先我们需要引入我们使用的组件

1
2
3
4
5
import {
   
    BackHandler, ToastAndroid

} from 'react-native';

然后在文件中React-Native组件中添加如下函数:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
    componentWillMount () {
        BackHandler.addEventListener('hardwareBackPress', this.onBackHandler);
    }

    componentWillUnmount () {
        BackHandler.removeEventListener('hardwareBackPress', this.onBackHandler);
    }

    onBackHandler = () => {
        if (this.lastBackPressed && this.lastBackPressed + 2000 >= Date.now()) {
            //最近2秒内按过back键,可以退出应用。
            return false;
        }
        this.lastBackPressed = Date.now();
        ToastAndroid.show('再按一次退出应用', ToastAndroid.SHORT);
        return true;
    };

表示如果在两秒以内连续按退出键,那么应用就会退出

需要注意:

目前最新版的React-Native中的生命周期函数写法已经修改,但是上面写的写法也是可以的,不过会报以下错误:

1
2
3
4
WARN  Warning: componentWillMount has been renamed, and is not recommended for use. See https://fb.me/react-async-component-lifecycle-hooks for details.

* Move code with side effects to componentDidMount, and set initial state in the constructor.
* Rename componentWillMount to UNSAFE_componentWillMount to suppress this warning in non-strict mode. In React 17.x, only the UNSAFE_ name will work. To rename all deprecated lifecycles to their new names, you can run `npx react-codemod rename-unsafe-lifecycles` in your project source folder.

译文:
警告警告:componentwillmount已重命名,建议不要使用。有关详细信息,请参见https://fb.me/react-async-component-lifecycle-hooks。

*将具有副作用的代码移动到componentdidmount,并在构造函数中设置初始状态。

*重命名componentwillmount为unsafe\u componentwillmount可在非严格模式下抑制此警告。在React 17.x中,只有不安全的名称才能工作。若要将所有不推荐的生命周期重命名为其新名称,可以在项目源文件夹中运行“npx react codemod rename unsafe lifecycles”。

博主暂时没有去解决这个问题

赞(0) 打赏
未经允许不得转载: » react native按返回提示再按一次退出应用
分享到: 更多 (0)

评论标题 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏