效果图
问题:
修改图一中的图片,使用浏览器回退,图二中图片没有修改。
解决方法:
使用监听popstate
事件来响应浏览器的后退或前进操作。
这个事件会在活动历史记录条目更改时触发,为了监听popstate
事件,可以在Vue组件的mounted
钩子中添加事件监听器,并在beforeDestroy
钩子中移除该监听器。确保事件监听器不会在组件销毁后继续运行,从而导致内存泄漏。
代码展示
mounted() {
window.addEventListener('popstate', () => {
this.queryPersonMessage();
});
},
beforeDestroy() {
window.removeEventListener('popstate', this.queryPersonMessage);
},
queryPersonMessage函数使我代码中,获取该图片的函数。