我的React应用程序允许用户上传个人资料图片.这是通过将图像上传到Amazon S3存储桶并将路径存储到数据库中的图像以及图像上载的日期和时间来完成的.图像的文件名设置为用户的ID.
我在用户上传新图片时遇到问题.由于图像路径相同,React不知道有什么变化,这意味着我必须刷新页面才能看到变化.
由于我有一个日期字段,我可以使用componentWillReceiveProps来了解何时上传了新图像.以下console.log会在正确的时间触发:
componentWillReceiveProps(nextProps) { if (this.state.picDate.getTime() !== nextProps.user.pic.date.getTime()) { console.log('image date has changed'); // this.forceUpdate(); } }
我可以用它来重新渲染图像吗?我试过这个.forceUpdate()但它不起作用.
我认为这是因为浏览器缓存.尝试在图像URL更改后添加一些像date.now()这样的哈希值.例如:
setState({ imageSrc: ...,imageHash: Date.now() })
并在渲染:
render(){ return( <img src={`${imageSrc}?${imageHash}`} /> ) }
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。