feat: 🚀 当页面退出给出是否确认提示

src/directives/index.ts

@@ -1,8 +1,9 @@
 import { App, Directive } from 'vue';
 import copy from './modules/copy';
+import existShow from './modules/existShow';
 import waterMarker from './modules/waterMarker';
 
-const directivesList: { [key: string]: Directive } = { copy, waterMarker };
+const directivesList: { [key: string]: Directive } = { copy, waterMarker, existShow };
 
 /**
  * 挂载自定义事件

src/directives/modules/existShow.ts

@@ -0,0 +1,20 @@
+import { Directive } from 'vue';
+
+interface ElType extends HTMLElement {
+	copyData: string | number; // 定义一个属性，用于存储需要复制的数据
+	__handleClick__: any; // 定义一个属性，用于存储事件处理函数
+}
+
+/**
+ * * 当关闭这个页面时提示是否退出，不需要传递参数
+ */
+const existShow: Directive = {
+	// 指令与元素绑定时触发
+	beforeMount(el: ElType) {
+		window.onbeforeunload = function (event) {
+			(event || window.event).returnValue = '确定离开此页吗？';
+		};
+	},
+};
+
+export default existShow;

src/views/bunny/default/index.vue

@@ -1,5 +1,5 @@
 <template>
-	<div v-waterMarker="{ text: 'Bunny Admin', textColor: 'rgba(180, 180, 180, 0.6)' }">
+	<div v-waterMarker="{ text: 'Bunny Admin', textColor: 'rgba(180, 180, 180, 0.6)' }" v-existShow>
 		<h1>bunny/default页面</h1>
 		<My />
 		<RouterView />