اللغات المدعومة في الصفحة الحالية:
简体中文浏览器原生API：beforeunload事件玩法
FrontendBest Practice
# Note
عدد الكلمات 682
الوقت المستغرق تقريباً 3 minutes
الخميس، 26 مارس 2026 في 15:14:00 UTC
为了在标签页刷新或关闭时显示自定义提示框，以免用户误操作导致数据丢失，我们可以使用 beforeunload 事件来做提醒。
相关MDN文档
示例（VueUse）
在需要监听标签页刷新或关闭的页面中，添加代码：
demo.ts
import { useEventListener } from '@vueuse/core'
// 监听标签页刷新&关闭
useEventListener('beforeunload', event => {
// 浏览器自带提示
event.preventDefault()
// Chrome浏览器要求必须调用
event.returnValue = ''
})