fixbug

src/views/login/index.vue

@@ -20,6 +20,23 @@ const printTextWrod = ref(["FONCHAT", "Let's Chat", "Let's Create", "Let's Go"])
 const backgroundColor = ref(['red', 'blue', '#f3f4f6', '#f3f4f6'])
 let printInterval = null
 onMounted(() => {
+  textEffect()
+})
+onUnmounted(() => {
+  clearInterval(printInterval)
+})
+// 解决离开页面文字堆叠
+document.addEventListener('visibilitychange', function () {
+  if (document.hidden) {
+    clearInterval(printInterval)
+    document.querySelector('#chat').innerText = ''
+  } else {
+    clearInterval(printInterval)
+    textEffect()
+  }
+})
+// 文字特效逻辑
+function textEffect() {
   printText(printTextWrod.value[0])
   let index = 1
   printInterval = setInterval(() => {
@@ -30,10 +47,7 @@ onMounted(() => {
     index++
     document.querySelector('#chat').innerText = ''
   }, 2500)
-})
+}
-onUnmounted(() => {
-  clearInterval(printInterval)
-})
 function login() {
   router.push('/')
 }