去掉_this

src/views/exercise_questions/preview/components/common/Strockplayredline.vue

@@ -1,4 +1,3 @@
-<!--  -->
 <template>
   <div class="strockplay-redInner">
     <div v-if="playStorkes" :class="['strock-play-box']" @click="playHanzi">
@@ -47,59 +46,44 @@ export default {
     targetDiv: {
       handler(val, oldVal) {
         if (val !== oldVal) {
-          let _this = this;
-          _this.$nextTick(() => {
-            _this.initHanziwrite();
+          this.$nextTick(() => {
+            this.initHanziwrite();
           });
         }
       },
-      // 深度观察监听
       deep: true,
     },
   },
-  // 生命周期 - 创建完成（可以访问当前this实例）
-  created() {},
-  // 生命周期 - 挂载完成（可以访问DOM元素）
   mounted() {
-    let _this = this;
-    _this.$nextTick(() => {
-      _this.initHanziwrite();
+    this.$nextTick(() => {
+      this.initHanziwrite();
     });
   },
-  beforeCreate() {}, // 生命周期 - 创建之前
-  beforeMount() {}, // 生命周期 - 挂载之前
-  beforeUpdate() {}, // 生命周期 - 更新之前
-  updated() {}, // 生命周期 - 更新之后
-  beforeDestroy() {}, // 生命周期 - 销毁之前
-  destroyed() {}, // 生命周期 - 销毁完成
-  activated() {},
   // 方法集合
   methods: {
     initHanziwrite() {
-      let _this = this;
-      _this.writer = HanziWriter.default.create(_this.targetDiv, _this.bookText, {
+      this.writer = HanziWriter.default.create(this.targetDiv, this.bookText, {
         charDataLoader(char, onComplete) {
-          onComplete(_this.bookStrokes);
+          onComplete(this.bookStrokes);
         },
         padding: 5,
         showOutline: true,
-        strokeColor: _this.strokeColor ? _this.strokeColor : '#000',
+        strokeColor: this.strokeColor ? this.strokeColor : '#000',
       });
     },
     playHanzi(event) {
-      let _this = this;
-      _this.writer.animateCharacter();
       event.stopPropagation();
+      this.writer.animateCharacter();
     },
-  }, // 如果页面有keep-alive缓存功能，这个函数会触发
+  },
 };
 </script>
+
 <style lang="scss" scoped>
-//@import url(); 引入公共css类
 .strockplay-redInner {
   position: relative;
-  width: 64px; //444px
-  height: 64px; //480px
+  width: 64px; // 444px
+  height: 64px; // 480px
 }
 
 .character-target-div {

src/views/exercise_questions/preview/components/common/Strockred.vue

@@ -1,4 +1,3 @@
-<!--  -->
 <template>
   <div class="strockredBox">
     <div class="strockred">
@@ -53,66 +52,50 @@ export default {
     Book_text: {
       handler(val, oldVal) {
         if (val !== oldVal) {
-          let _this = this;
-          _this.$nextTick(() => {
-            _this.initHanziwrite();
+          this.$nextTick(() => {
+            this.initHanziwrite();
           });
         }
       },
-      // 深度观察监听
       deep: true,
     },
   },
-  // 生命周期 - 创建完成（可以访问当前this实例）
-  created() {},
-  // 生命周期 - 挂载完成（可以访问DOM元素）
   mounted() {
-    let _this = this;
-    _this.$nextTick(() => {
-      _this.initHanziwrite();
+    this.$nextTick(() => {
+      this.initHanziwrite();
     });
   },
-  beforeCreate() {}, // 生命周期 - 创建之前
-  beforeMount() {}, // 生命周期 - 挂载之前
-  beforeUpdate() {}, // 生命周期 - 更新之前
-  updated() {}, // 生命周期 - 更新之后
-  beforeDestroy() {}, // 生命周期 - 销毁之前
-  destroyed() {}, // 生命周期 - 销毁完成
-  activated() {},
   // 方法集合
   methods: {
     initHanziwrite() {
-      let _this = this;
       let options = {
         charDataLoader(char, onComplete) {
-          onComplete(_this.bookStrokes);
+          onComplete(this.bookStrokes);
         },
         padding: 5,
         showCharacter: false,
-        strokeColor: _this.hanziColor,
-        drawingColor: _this.hanziColor,
+        strokeColor: this.hanziColor,
+        drawingColor: this.hanziColor,
         drawingWidth: 6,
       };
-      _this.writer = HanziWriter.default.create(_this.targetDiv, _this.Book_text, options);
-      _this.writer.quiz();
+      this.writer = HanziWriter.default.create(this.targetDiv, this.Book_text, options);
+      this.writer.quiz();
     },
     resetHanzi() {
-      let _this = this;
-      _this.writer.quiz();
+      this.writer.quiz();
     },
     updateColor(color) {
-      let _this = this;
-      _this.writer.updateColor('strokeColor', color);
-      _this.writer.updateColor('drawingColor', color);
+      this.writer.updateColor('strokeColor', color);
+      this.writer.updateColor('drawingColor', color);
     },
-  }, // 如果页面有keep-alive缓存功能，这个函数会触发
+  },
 };
 </script>
+
 <style lang="scss" scoped>
-//@import url(); 引入公共css类
 .strockredBox {
-  width: 64px; //444px
-  height: 64px; //480px
+  width: 64px; // 444px
+  height: 64px; // 480px
 }
 
 .strockred {