HarmonyOS鸿蒙Next中如何实现快应用页面退出时弹框确认

HarmonyOS鸿蒙Next中如何实现快应用页面退出时弹框确认 【现象描述】

很多产品在设计时，希望按返回键退出的时候弹出一个对话框来确认是否退出，从而留住用户。快应用提供了这样的功能，和原生App一样，都是在页面的回调函数中处理的。

【实现方法】

快应用提供了页面生命周期回调函数onBackPress。开发者可重写onBackPress生命周期，在里面自定义返回逻辑，并且返回值必须为true，否则快应用引擎会按照false处理，页面直接退出。以下示例代码中调用了prompt接口实现弹框，点击“确定”后退出，点击“取消”则停留在当前页面。

onBackPress() {
console.log("quit!!!")
var that = this
prompt.showDialog({
title: 'title',
message: '确认不再继续浏览了，要退出吗？',
buttons: [
{
text: '确定',
color: '#33dd44',
},
{
text: '取消',
color: '#33dd44'
}
],
success: function (data) {
console.log("handling callback", data); //返回选中按钮在buttons数组中的序号。
if (data.index === 0) { //点击确定按钮后的行为
that.$app.exit()
}else if(data.index === 1){ //点击取消按钮后的行为
console.log("cancel button is clicked");
}
},
cancel: function () {
console.log("cancel");
}
})
return true
}

【代码运行效果】

如下图所示：


更多关于HarmonyOS鸿蒙Next中如何实现快应用页面退出时弹框确认的实战教程也可以访问 https://www.itying.com/category-93-b0.html

4 回复

这个版本太老了, 在5.0上显示好多错误, 希望能出一个新的.

更多关于HarmonyOS鸿蒙Next中如何实现快应用页面退出时弹框确认的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


谢分享。

学习了

在HarmonyOS鸿蒙Next中，实现快应用页面退出时弹框确认，可以通过监听页面的生命周期事件，并在onBackPress方法中处理。具体步骤如下：

  1. 监听页面生命周期：在页面的onInit方法中，监听onBackPress事件。
  2. 弹框确认：在onBackPress方法中，使用prompt.showDialog弹出确认对话框。
  3. 处理用户选择：根据用户选择，决定是否退出页面。

示例代码：

onInit() {
    this.$page.onBackPress = () => {
        prompt.showDialog({
            message: '确定要退出吗？',
            buttons: [
                { text: '取消' },
                { text: '确定' }
            ]
        }).then((data) => {
            if (data.index === 1) {
                this.$page.finish();
            }
        });
        return true; // 阻止默认返回行为
    };
}
回到顶部