我在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>
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": {
少了第一个清除就能执行,多了这一个清除就不能执行。很奇怪。。。
2023-09-12 19:30
喜欢技术的前端
回复 4***@qq.com: 还有这种操作☺☺
2023-09-12 23:06