[英]React Load hashed image from data while loading Image
I m making a project with react and which i get the data from a JSON file.我正在使用 react 制作一个项目,并从 JSON 文件中获取数据。 I load an image with URL
我加载带有 URL 的图像
<img src={image} />
and I have a hashed image(blurred) in my data which i want to display while waiting to render the real image.我的数据中有一个散列图像(模糊),我想在等待渲染真实图像时显示它。 Any what to do this?
有什么办法吗?
JSON is like: JSON 是这样的:
"hash": "UUKJMXvM{V@AHRQwvxZXSs9s;o0",
"image": "https://www.imageurl.com/",
You can use react-progressive-image
which is a npm package used for progressive image loading.您可以使用
react-progressive-image
这是一个用于渐进式图像加载的 npm 包。 You can install it using:您可以使用以下方法安装它:
npm i react-progressive-image
And then use it like:然后像这样使用它:
<ProgressiveImage src={image} placeholder={hash}>
{src => <img src={src} alt="an image" />}
</ProgressiveImage>
Hope this will help you.希望这会帮助你。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.