单页应用中的Lazysize不更新属性以加载图像

Question

我有一个反应式单页应用程序。我正在使用lazysizes进行图像的懒惰处理。

在生产中，我看到在加载图像时data-src添加了src属性，而data-srcset添加了srcset属性。 但是，当我导航并加载另一个页面时，data-srcset和data-src属性值与您期望的不同，但是src和srcset属性值是较早的页。 该值未刷新，因此页面无法获取新图像并最终显示旧图像。

正在添加图片标签：

<img data-expand="1" data-srcset={srcset} data-src={image} className="lazyload"/>

首次加载：

<img data-expand="1" data-srcset="ABC1 1x, ABC2 2x, ABC3 3x" data-src="/image/ABC.png" srcset="ABC1 1x, ABC2 2x, ABC3 3x" src="/image/ABC.png">

第二次加载（加载另一页之后。data-srcset和data-src已更新，但没有更新srcset和src标签）：

<img data-expand="1" data-srcset="XYZ1 1x, XYZ2 2x, XYZ3 3x" data-src="/image/XYZ.png" srcset="ABC1 1x, ABC2 2x, ABC3 3x" src="/image/ABC.png">

这就是我添加lazysizes

的方式

    <script src="lazysizes.min.js" async=""></script>