diff --git a/pages/composition/mixins/mixins.uts b/pages/composition/mixins/mixins.uts index 4a4c0fba6ece491567363dce7d2329894b93a045..aed98d4492e43b38c7f848cd97f09fa20ad073e1 100644 --- a/pages/composition/mixins/mixins.uts +++ b/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 - }, + } } })