4***@qq.com
4***@qq.com
  • 发布:2023-09-12 13:35
  • 更新:2023-09-12 13:42
  • 阅读:282

延时弹窗到其他页面显示的问题。求助

分类:uni-app

我在B页面设置了一个延时的弹窗,具体效果是,A页面进入B页面后,经过6s后弹窗出现,点击弹窗,返回A页面。目前这个功能已经实现了,但是现在有一个BUG需要修复,那就是我们没办法保证用户能完整运行上述过程。用户可能进入B页面后,还没有等待弹窗出现,用户就自行返回了A页面。而这个时候,弹窗会在A页面显示。产生BUG。请大家告诉我怎么办。求助!!!
相关代码如下:附件是我的运行视频。。
A页面:
<template>
<view class='anniu' @click="navigateToinject()">
<text class=''>
跳转B页面
</text>
</view>
</template>

<script>
export default {
components: {},
data() {
return {
};
},
methods: {
navigateToinject() {
this.$router.push({
path: '/pages/ceshi2',
});
}
},
}
</script>

<style>
.anniu{
width: 100%;
height: 10vh;
background-color: bisque;
}
</style>

B页面:
<template>
<view>
等待3s
</view>
</template>

<script>
export default {
components: {},
data() {
return {
timer: null, // 用于存储 setTimeout 的返回值

        };  
    },  
    methods: {  
        //设置弹窗  
        showModal() {  
            uni.showModal({  
                title: '提示',  
                content: '返回上一页',  
                showCancel: false,   //取消“取消按钮”  
                success: (res) => {  //  
                    const pages = getCurrentPages();  
                    const prevPage = pages[pages.length - 2].route;   //获取上一个页面路径  
                    const prevPageOptions = pages[pages.length - 2].options;  
                    const prevPageUrl = `/${prevPage}?${Object.keys(prevPageOptions).map(key => `${key}=${prevPageOptions[key]}`).join('&')}`;  
                    console.log(prevPageUrl)  
                    uni.reLaunch({  
                        url: prevPageUrl, // 重新加载当前页  
                    });  
                }  
            });  
        }  
    },  
    mounted() {  
        this.timer = setTimeout(() => {  
            this.showModal();  
        }, 3000);  
    },  
    beforeDestroy() {  
        clearTimeout(this.timer); // 清除定时器  
    },  
}  

</script>

<style>
</style>

2023-09-12 13:35 负责人:无 分享
已邀请:
喜欢技术的前端

喜欢技术的前端 - QQ---445849201

在onBackPress 钩子中,清除定时器

  • 4***@qq.com (作者)

    不行,我再很多钩子都做了清除设置,没用= =

    2023-09-12 14:57

  • 喜欢技术的前端

    回复 4***@qq.com: 有办法,定义一个变量flag为true,你可以在返回钩子中将这个变量修改为false 在你定时器中,中加一层判断


    if(this.flag){this.showModal()}

    2023-09-12 15:05

  • 4***@qq.com (作者)

    回复 喜欢技术的前端: 我后面发现不是代码的问题,我部署了新的环境,发现清除有用了,然后就发现是项目环境的问题,开始排查,然后发现一个很诡异的事~我要发布一个新帖子来问了= =

    2023-09-12 19:29

  • 4***@qq.com (作者)

    回复 喜欢技术的前端: 配置文件中:{

    "pages": [ //pages数组中第一项表示应用启动页,参考:https://uniapp.dcloud.io/collocation/pages

    //注销掉下面的内容就可以了

    {

    "path": "pages/index",

    "style": {


            }  
    },
    {
    "path": "pages/ceshi",
    "style": {

    }
    },{
    "path": "pages/ceshi2",
    "style": {

    }
    }
    ],

    少了第一个清除就能执行,多了这一个清除就不能执行。很奇怪。。。

    2023-09-12 19:30

  • 喜欢技术的前端

    回复 4***@qq.com: 还有这种操作☺☺

    2023-09-12 23:06

要回复问题请先登录注册