uni-app nvue页面setTimeout无效

uni-app nvue页面setTimeout无效

开发环境 版本号 项目创建方式
Windows 11 HBuilderX 
产品分类：uniapp/App

PC开发环境操作系统：Windows

PC开发环境操作系统版本号：11

HBuilderX类型：正式

HBuilderX版本号：4.66

手机系统：Android

手机系统版本号：Android 12

手机厂商：华为

手机机型：mate40 Pro

页面类型：nvue

vue版本：vue3

打包方式：云端

项目创建方式：HBuilderX

### 示例代码：

```javascript
closePage() {  
  // 清除旧定时器  
  if (this.exitTimer) {  
    clearTimeout(this.exitTimer);  
    this.exitTimer = null;  
  }  

  showToast(" 对方已退出 ", 1000);  
  this.exitTimer = setTimeout(this.exitMeeting, 1000);  
},  
//执行的方法  
exitMeeting() {  
  uni.navigateBack();  
},

操作步骤：

第二次打开这个界面后点击关闭后

预期结果：

执行成功回退界面

实际结果：

18:15:16.024 [JS Framework] Failed to find taskCenter (2). 18:15:16.024 [JS Framework] Failed to execute the callback function: TypeError: c.setTimeout is not a function 18:15:16.031 reportJSException >>>>> exception function:WEEX_CALL_JAVASCRIPT, exception:JavaScript execute error!Uncaught TypeError: c.setTimeout is not a function at setTimeout (uni-jsframework.js:62:909) at consume (uni-jsframework.js:23:15752) at callback (uni-jsframework.js:25:1659) at Yk (uni-jsframework.js:25:4009) at (uni-jsframework.js:25:4502) at dp (uni-jsframework.js:25:4455)

bug描述：

1、在nvue页面执行setTimeout，第一次打开页面执行永远有效

2、第二次打开页面时就会提示如下错误

18:15:16.024 [JS Framework] Failed to find taskCenter (2).  
18:15:16.024 [JS Framework] Failed to execute the callback function:  
 TypeError: c.setTimeout is not a function  
18:15:16.031 reportJSException >>>>> exception function:__WEEX_CALL_JAVASCRIPT__, exception:JavaScript execute error!Uncaught TypeError: c.setTimeout is not a function  
 at setTimeout (uni-jsframework.js:62:909)  
 at consume (uni-jsframework.js:23:15752)  
 at callback (uni-jsframework.js:25:1659)  
 at Yk (uni-jsframework.js:25:4009)  
 at  (uni-jsframework.js:25:4502)  
 at dp (uni-jsframework.js:25:4455)

更多关于uni-app nvue页面setTimeout无效的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于uni-app nvue页面setTimeout无效的实战教程也可以访问 https://www.itying.com/category-93-b0.html


这个问题的原因是nvue页面在第二次打开时，Weex引擎的taskCenter丢失导致setTimeout失效。在nvue环境下，setTimeout依赖于Weex的任务中心机制。

解决方案：

  1. 使用uni-app提供的全局定时器API替代原生setTimeout：
closePage() {
  if (this.exitTimer) {
    clearTimeout(this.exitTimer);
    this.exitTimer = null;
  }
  
  showToast("对方已退出", 1000);
  this.exitTimer = uni.$setTimeout(this.exitMeeting, 1000);
},
  1. 或者使用Vue3的ref保存定时器：
import { ref } from 'vue';

const exitTimer = ref(null);

function closePage() {
  if (exitTimer.value) {
    clearTimeout(exitTimer.value);
  }
  
  showToast("对方已退出", 1000);
  exitTimer.value = setTimeout(exitMeeting, 1000);
}
  1. 确保在页面卸载时清理定时器：
onUnmounted(() => {
  if (this.exitTimer) {
    clearTimeout(this.exitTimer);
  }
});
回到顶部