mirror of
https://github.com/zoriya/react-native-web.git
synced 2026-05-12 19:06:35 +00:00
[fix] ImageLoader: ImageUriCache is not kept up to date with loaded images
Close #2493
This commit is contained in:
committed by
Nicolas Gallagher
parent
36f46b3510
commit
e722282c09
@@ -327,7 +327,7 @@ const BaseImage: ImageComponent = React.forwardRef((props, ref) => {
|
||||
|
||||
function abortPendingRequest() {
|
||||
if (requestRef.current != null) {
|
||||
ImageLoader.abort(requestRef.current);
|
||||
ImageLoader.clear(requestRef.current);
|
||||
requestRef.current = null;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -74,12 +74,13 @@ let id = 0;
|
||||
const requests = {};
|
||||
|
||||
const ImageLoader = {
|
||||
abort(requestId: number) {
|
||||
let image = requests[`${requestId}`];
|
||||
clear(requestId: number) {
|
||||
const image = requests[`${requestId}`];
|
||||
if (image) {
|
||||
image.onerror = null;
|
||||
image.onload = null;
|
||||
image = null;
|
||||
ImageUriCache.remove(image.src);
|
||||
image.src = '';
|
||||
delete requests[`${requestId}`];
|
||||
}
|
||||
},
|
||||
@@ -102,7 +103,7 @@ const ImageLoader = {
|
||||
}
|
||||
}
|
||||
if (complete) {
|
||||
ImageLoader.abort(requestId);
|
||||
ImageLoader.clear(requestId);
|
||||
clearInterval(interval);
|
||||
}
|
||||
}
|
||||
@@ -111,7 +112,7 @@ const ImageLoader = {
|
||||
if (typeof failure === 'function') {
|
||||
failure();
|
||||
}
|
||||
ImageLoader.abort(requestId);
|
||||
ImageLoader.clear(requestId);
|
||||
clearInterval(interval);
|
||||
}
|
||||
},
|
||||
@@ -123,6 +124,7 @@ const ImageLoader = {
|
||||
const image = new window.Image();
|
||||
image.onerror = onError;
|
||||
image.onload = (nativeEvent) => {
|
||||
ImageUriCache.add(uri);
|
||||
// avoid blocking the main thread
|
||||
const onDecode = () => {
|
||||
// Append `source` to match RN's ImageLoadEvent interface
|
||||
@@ -185,9 +187,8 @@ const ImageLoader = {
|
||||
ImageLoader.load(
|
||||
uri,
|
||||
() => {
|
||||
// Add the uri to the cache so it can be immediately displayed when used
|
||||
// but also immediately remove it to correctly reflect that it has no active references
|
||||
ImageUriCache.add(uri);
|
||||
// load() adds the uri to the cache so it can be immediately displayed when used,
|
||||
// but we also immediately remove it to correctly reflect that it has no active references
|
||||
ImageUriCache.remove(uri);
|
||||
resolve();
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user