Caldis / react-zmage

一个基于 React 的可缩放图片控件 | A scalable image wrapper power by react

Home Page:https://zmage.caldis.me

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

当路由切换时react会报出一个警告

SystemLight opened this issue · comments

commented

当路由切换时react会报出一个警告

警告内容:
Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in the componentWillUnmount method.
in Browser (created by ReactZmage)
in ReactZmage (created by ForwardRef)
in ForwardRef (created by ImageView)
in div (created by ImageView)
in ImageView (created by Info)
in div (created by Info)
in Info (created by Context.Consumer)
in Route (created by RouteView)

zmage是否在被卸载时清除了异步任务

commented

移动端中 使用Zmage.browsing方式和Zmage组件,图片回到原来位置时,两种使用方式的还原动画不一致,该还原动画效果可以设置参数进行控制么?

commented

我也遇到了同样的问题 @Caldis
demo代码地址:
https://codesandbox.io/s/quirky-violet-chtgv?file=/src/img.js

image

commented

我怀疑是Bowser.js中在组件销毁时调用uninit()方法里面,调用this.setState导致
image

commented

@Alisa0026 看上去是这个样子的,我使用了Zmage.browsing方法而不是组件的形式会避免开这个问题,不过还存在移动端无法缩放的问题,所以我改用了这个 react-photo-view 组件 看上去更精致一些。
https://github.com/MinJieLiu/react-photo-view

谢谢反馈, 经检查貌似是严格模式的 <React.StrictMode/> 导致的, 而且会导致组件重复渲染
browsing 这块的 unInit 处理是一个反模式, 后续会优化