小伙伴们晚上好,欢迎来到前端小妙招。相信大家都知道 History API,但是你知道 History API 都有哪些巧妙应用吗?下面就让我讲一讲 History API 的巧妙应用:点退后关闭窗口。
我们先看看效果。
注意看,点了退后按钮后窗口自动关闭了。这是怎么做到的呢?
首先,在打开按钮的同时执行 history.pushState,这样浏览器就会多一条历史记录而不刷新。
然后,我们点击退后按钮。这时浏览器会触发 onpopstate 事件。
最后,我们把相应的窗口关掉就可以了。
在实际使用,我们可以结合弹窗管理和路由管理进行封装,降低使用难度。
好了,本期视频就到这啦,喜欢的小伙伴可以点击订阅收藏和关注,我们下次见了,拜拜。