Kaynağa Gözat

更新 'xwding-fronted/src/components/index2.vue'

不使用路由重定向,进行变量刷新,不闪白
Paul 2 yıl önce
ebeveyn
işleme
f79893095f
1 değiştirilmiş dosya ile 42 ekleme ve 27 silme
  1. 42 27
      xwding-fronted/src/components/index2.vue

+ 42 - 27
xwding-fronted/src/components/index2.vue

@@ -245,6 +245,8 @@ export default {
           this.wordIndex = this.keys.length;
           this.word = this.words[this.wordIndex];
           this.showCountDown = true;
+          this.currentRate=100;
+          this.rate =100;
           for (let i = 0; i < 2; i++) {
             this.rate = this.rate - 50;
             setTimeout(() => {
@@ -281,12 +283,12 @@ export default {
     exam() {
       this.examLoading = true;
       apiFunc.getWords().then((res) => {
-       // this.wordInfo = res.data;
+       // this.wordInfo = res.data;       
         for (let i = 0; i < 50; i++) {
-          this.words.push(res.data[i].subWord);
-          this.chats.push(res.data[i].online);
-          this.correctKeys.push(res.data[i].key);
-          this.translation.push(res.data[i].chinese + " ");// add this " " for split translation,otherwise if contain "," use "," split will occur error
+          this.words[i] = res.data[i].subWord;//this.words.push(res.data[i].subWord);,不使用push,不退页面,连续测试时,永远取得是第1次的前50个
+          this.chats[i] = res.data[i].online;
+          this.correctKeys[i] = res.data[i].key;
+          this.translation[i] = res.data[i].chinese + " ";// add this " " for split translation,otherwise if contain "," use "," split will occur error
         }
         localStorage.setItem(
           new Date().getMonth() + 1 + "-" + new Date().getDate() + "words",
@@ -314,6 +316,8 @@ export default {
         );
         this.examLoading = false;
         this.showCountDown = true;
+        this.currentRate=100;
+        this.rate =100;
         for (let i = 0; i < 2; i++) {
           this.rate = this.rate - 50;
           setTimeout(() => {
@@ -338,7 +342,8 @@ export default {
     finish() {
       this.wordIndex++;
       if (this.wordIndex < this.words.length) {
-        this.keys.push(this.key);
+        let indexKey = this.wordIndex - 1;
+        this.keys[indexKey] = this.key;        
         localStorage.setItem(
           new Date().getMonth() + 1 + "-" + new Date().getDate() + "keys",
           this.keys
@@ -355,7 +360,8 @@ export default {
         }
       }
       if (this.wordIndex == this.words.length) {
-        this.keys.push(this.key);
+        let indexKey = this.wordIndex - 1;
+        this.keys[indexKey] = this.key;   
         localStorage.setItem(
           new Date().getMonth() + 1 + "-" + new Date().getDate() + "keys",
           this.keys
@@ -372,23 +378,27 @@ export default {
         }
         apiFunc.submitGrade(this.score, Cookies.get("userName")).then((res) => {
           if (res.data === 1) {
+                          // on close
+                          this.flag = false;
+              this.showWordCountDown = false;
+              this.exampercentage = 0;
+              this.wordIndex = 0;
+              this.onRefresh(); //页面不会闪白
+
             Dialog.alert({
               title: "测试结束",
               message: "分数为 " + this.score,
             }).then(() => {
-              // on close
-              this.flag = false;
-              this.showWordCountDown = false;
-              localStorage.clear();              
+              
               if (this.score < 100) {
                 //this.scoreLess100 = true;
                 Dialog.alert(
                   {                    
                      message:  "答错" + "\n" + this.errorStr,
                   }
-                ).then(()=>{ this.$router.go(0);});
-              }else{ this.$router.go(0); };//this.$router.go(0);解决测试1次后,不退出,再测试,分数不变的问题,Dialog.alert,不能阻塞后面的语句
-              
+                )
+              };
+              //this.$router.go(0);路由重定向,页面会闪白,解决测试1次后,不退出,再测试,分数不变的问题,Dialog.alert,不能阻塞后面的语句             
             });
           }
         });
@@ -397,7 +407,8 @@ export default {
     nextBtn() {
       this.wordIndex++;
       if (this.wordIndex < this.words.length) {
-        this.keys.push(this.key);
+        let indexKey = this.wordIndex - 1;
+        this.keys[indexKey] = this.key; 
         localStorage.setItem(
           new Date().getMonth() + 1 + "-" + new Date().getDate() + "keys",
           this.keys
@@ -414,7 +425,8 @@ export default {
         }
       }
       if (this.wordIndex == this.words.length) {
-        this.keys.push(this.key);
+        let indexKey = this.wordIndex - 1;
+        this.keys[indexKey] = this.key; 
         localStorage.setItem(
           new Date().getMonth() + 1 + "-" + new Date().getDate() + "keys",
           this.keys
@@ -431,22 +443,27 @@ export default {
         }
         apiFunc.submitGrade(this.score, Cookies.get("userName")).then((res) => {
           if (res.data === 1) {
+                                      // on close
+                                      this.flag = false;
+              this.showWordCountDown = false;
+              this.exampercentage = 0;
+              this.wordIndex = 0;
+              this.onRefresh(); //页面不会闪白
+
             Dialog.alert({
               title: "测试结束",
               message: "分数为 " + this.score,
             }).then(() => {
-              // on close
-              this.flag = false;
-              this.showWordCountDown = false;
-              localStorage.clear();              
+             
               if (this.score < 100) {
                 //this.scoreLess100 = true;
                 Dialog.alert(
                   {                    
                      message:  "答错" + "\n" + this.errorStr,
                   }
-                ).then(()=>{ this.$router.go(0);});
-              }else{ this.$router.go(0); };//this.$router.go(0);解决测试1次后,不退出,再测试,分数不变的问题,Dialog.alert,不能阻塞后面的语句
+                )
+              };
+               //this.$router.go(0);路由重定向,页面会闪白,解决测试1次后,不退出,再测试,分数不变的问题,Dialog.alert,不能阻塞后面的语句
             });
           }
         });
@@ -460,9 +477,7 @@ export default {
       // setTimeout 仅做示例,真实场景中一般为 ajax 请求
       apiFunc.getGrade(Cookies.get("userName")).then((res) => {
         for (let i = 0; i < res.data.length; i++) {
-          this.list.push(
-            "分数:" + res.data[i].grade + "\t日期:" + res.data[i].date
-          );
+          this.list[i] =  "分数:" + res.data[i].grade + "\t日期:" + res.data[i].date;
         }
 
         // 加载状态结束
@@ -490,12 +505,12 @@ export default {
   background-color: #fafafa;
 }
 .start-btn {
-  width: 268px;
+  width: 278px;
   height: 48px;
 
 }
 .next-btn {
-  width: 268px;
+  width: 278px;
   height: 48px;
 
 }