关于在微信小程序中使用taro + react-hook后销毁函数无法执行的问题

问题:

在 taro中使用navigageTo() 跳转路由后hook中useEffect 的return函数没有执行

没有执行return函数

框架版本: tarojs: 3.6

react: 18.0

原因: 使用navigateTo() 跳转路由的话并不会销毁页面和组件,会加入一个最大数量为十层的路由栈,之前路由只是被隐藏了, so 没有销毁 肯定就没有执行销毁函数(return);

解决方案:

**1.**改用其他路由跳转方式

redirectTo(): 跳转到目的页面,在当前页面打开

reLaunch(): 关闭所有页面,打开到应用内的某个页面

2. 在taro 提供的专属的生命周期里面处理销毁时间

useDidHide(): 页面隐藏/切入后台时触发。等同于 componentDidHide 页面生命周期钩子。

3. 在navigateTo()的成功函数success里面 写销毁后的相关操作(算是曲线救国操作吧) Taro 文档

复制代码
Taro.navigateTo({
  url: 'test?id=1',
  success: function () {
    // 或者执行当前页面销毁操作需要处理的事
    console.log('currentDestory fffffdestory');
  }
})

官方参考文档:Taro 文档

相关推荐
pe7er6 小时前
状态提升:前端开发中的状态管理的设计思想
前端·vue.js·react.js
晚风予星8 小时前
Ant Design Token Lens 迎来了全面升级!支持在 .tsx 或 .ts 文件中直接使用 Design Token
前端·react.js·visual studio code
青青家的小灰灰12 小时前
React 架构进阶:自定义 Hooks 的高级设计模式与最佳实践
前端·react.js·前端框架
大米饭消灭者1 天前
Taro是怎么实现一码多端的【底层原理】
微信小程序·taro
yuki_uix1 天前
Props、Context、EventBus、状态管理:组件通信方案选择指南
前端·javascript·react.js
牛奶2 天前
React 底层原理 & 新特性
前端·react.js·面试
牛奶2 天前
React 基础理论 & API 使用
前端·react.js·面试
小呆呆_小乌龟2 天前
同样是定义对象,为什么 TS 里有人用 interface,有人用 type?
前端·react.js
代码小学僧2 天前
为什么我推荐前端项目都应该使用 TanStack Query 管理接口请求
前端·react.js·axios
不会敲代码12 天前
React 受控组件与非受控组件完全指南
前端·react.js