refactor(mixins): 优化变量声明

pages/composition/mixins/mixins.uts

@@ -3,121 +3,121 @@ import ChildMixinComp1 from './components/ChildMixinComp1.uvue'
 import MixinCompForMixin from './components/MixinCompForMixin.uvue'
 import MixinCompForChildMixin from './components/MixinCompForChildMixin.uvue'
 
-export const pageMixin = defineMixin({
-  mixins: [childMixin],
-  components: { MixinComp1, MixinComp: MixinCompForMixin },
+const childMixin = defineMixin({
+  components: { ChildMixinComp1, MixinComp: MixinCompForChildMixin },
   props: {
-    mixinProp1: {
+    childMixinProp1: {
       type: String,
-      default: '通过 defineMixin 定义非全局 mixin props'
+      default: '通过 defineMixin 定义非全局 child mixin props'
     },
-    namesakeMixinProp: {
+    namesakeChildMixinProp: {
       type: String,
-      default: '通过 defineMixin 定义非全局同名 mixin props'
+      default: '通过 defineMixin 定义非全局同名 child mixin props'
     }
   },
   data() {
     return {
-      mixinDataMsg1: '通过 defineMixin 定义非全局 mixin data',
-      namesakeMixinDataMsg: '通过 defineMixin 定义非全局同名 mixin data',
-      mixinOnloadMsg1: '',
-      mixinOnloadTime1: 0,
-      mixinWatchMsg1: ''
+      childMixinDataMsg1: '通过 defineMixin 定义非全局 child mixin data',
+      namesakeChildMixinDataMsg: '通过 defineMixin 定义非全局同名 mixin data',
+      childMixinOnloadMsg1: '',
+      childMixinOnloadTime1: 0,
+      childMixinWatchMsg1: ''
     }
   },
   computed: {
-    mixinComputed1(): string {
-      const res = `通过 defineMixin 定义非全局 mixin computed, 更新后的 mixinOnloadMsg1: ${this.mixinOnloadMsg1}`
+    childMixinComputed1(): string {
+      const res = `通过 defineMixin 定义非全局 child mixin computed, 更新后的 childMixinOnloadMsg1: ${this.childMixinOnloadMsg1}`
       console.log(res)
       return res
     },
-    namesakeMixinComputed(): string {
-      const res = '通过 defineMixin 定义非全局同名 mixin computed'
+    namesakeChildMixinComputed(): string {
+      const res = '通过 defineMixin 定义非全局同名 child computed'
       console.log(res)
       return res
     }
   },
   watch: {
     globalMixinOnloadMsg1(newVal: string) {
-      this.mixinWatchMsg1 = `通过 defineMixin 定义非全局 mixin watch, 更新后的 globalMixinOnloadMsg1: ${newVal}`
-      console.log(this.mixinWatchMsg1)
+      this.childMixinWatchMsg1 = `通过 defineMixin 定义非全局 child mixin watch, 更新后的 globalMixinOnloadMsg1: ${newVal}`
+      console.log(this.childMixinWatchMsg1)
     },
   },
   onLoad() {
-    this.mixinOnloadTime1 = Date.now()
-    const res = '通过 defineMixin 定义非全局 mixin onLoad'
+    this.childMixinOnloadTime1 = Date.now()
+    const res = '通过 defineMixin 定义非全局 child mixin onLoad'
     console.log(res)
-    this.mixinOnloadMsg1 = res
+    this.childMixinOnloadMsg1 = res
   },
   methods: {
-    mixinMethod1(): string {
-      const res = '通过 defineMixin 定义非全局 mixin method'
+    childMixinMethod1(): string {
+      const res = '通过 defineMixin 定义非全局 child mixin method'
       console.log(res)
       return res
     },
-    namesakeMixinMethod(): string {
-      const res = '通过 defineMixin 定义非全局同名 mixin method'
+    namesakeChildMixinMethod(): string {
+      const res = '通过 defineMixin 定义非全局同名 child mixin method'
       console.log(res)
       return res
-    }
+    },
   }
 })
 
-const childMixin = defineMixin({
-  components: { ChildMixinComp1, MixinComp: MixinCompForChildMixin },
+export const pageMixin = defineMixin({
+  mixins: [childMixin],
+  components: { MixinComp1, MixinComp: MixinCompForMixin },
   props: {
-    childMixinProp1: {
+    mixinProp1: {
       type: String,
-      default: '通过 defineMixin 定义非全局 child mixin props'
+      default: '通过 defineMixin 定义非全局 mixin props'
     },
-    namesakeChildMixinProp: {
+    namesakeMixinProp: {
       type: String,
-      default: '通过 defineMixin 定义非全局同名 child mixin props'
+      default: '通过 defineMixin 定义非全局同名 mixin props'
     }
   },
   data() {
     return {
-      childMixinDataMsg1: '通过 defineMixin 定义非全局 child mixin data',
-      namesakeChildMixinDataMsg: '通过 defineMixin 定义非全局同名 mixin data',
-      childMixinOnloadMsg1: '',
-      childMixinOnloadTime1: 0,
-      childMixinWatchMsg1: ''
+      mixinDataMsg1: '通过 defineMixin 定义非全局 mixin data',
+      namesakeMixinDataMsg: '通过 defineMixin 定义非全局同名 mixin data',
+      mixinOnloadMsg1: '',
+      mixinOnloadTime1: 0,
+      mixinWatchMsg1: ''
     }
   },
   computed: {
-    childMixinComputed1(): string {
-      const res = `通过 defineMixin 定义非全局 child mixin computed, 更新后的 childMixinOnloadMsg1: ${this.childMixinOnloadMsg1}`
+    mixinComputed1(): string {
+      const res = `通过 defineMixin 定义非全局 mixin computed, 更新后的 mixinOnloadMsg1: ${this.mixinOnloadMsg1}`
       console.log(res)
       return res
     },
-    namesakeChildMixinComputed(): string {
-      const res = '通过 defineMixin 定义非全局同名 child computed'
+    namesakeMixinComputed(): string {
+      const res = '通过 defineMixin 定义非全局同名 mixin computed'
       console.log(res)
       return res
     }
   },
   watch: {
     globalMixinOnloadMsg1(newVal: string) {
-      this.childMixinWatchMsg1 = `通过 defineMixin 定义非全局 child mixin watch, 更新后的 globalMixinOnloadMsg1: ${newVal}`
-      console.log(this.childMixinWatchMsg1)
+      this.mixinWatchMsg1 = `通过 defineMixin 定义非全局 mixin watch, 更新后的 globalMixinOnloadMsg1: ${newVal}`
+      console.log(this.mixinWatchMsg1)
     },
   },
   onLoad() {
-    this.childMixinOnloadTime1 = Date.now()
-    const res = '通过 defineMixin 定义非全局 child mixin onLoad'
+    this.mixinOnloadTime1 = Date.now()
+    const res = '通过 defineMixin 定义非全局 mixin onLoad'
     console.log(res)
-    this.childMixinOnloadMsg1 = res
+    this.mixinOnloadMsg1 = res
   },
   methods: {
-    childMixinMethod1(): string {
-      const res = '通过 defineMixin 定义非全局 child mixin method'
+    mixinMethod1(): string {
+      const res = '通过 defineMixin 定义非全局 mixin method'
       console.log(res)
       return res
     },
-    namesakeChildMixinMethod(): string {
-      const res = '通过 defineMixin 定义非全局同名 child mixin method'
+    namesakeMixinMethod(): string {
+      const res = '通过 defineMixin 定义非全局同名 mixin method'
       console.log(res)
       return res
-    },
+    }
   }
 })