如何解决在@Component中使用vue mixin
我正在使用vue-property-decorator软件包,并且我想在beforeRouteEnter挂钩中使用mixin方法。
我做了什么:
import { Component,Mixins } from 'vue-property-decorator';
import { myMixin } from '../mixins';
@Component({})
export default class myClass extends Mixins(myMixin) {
beforeRouteEnter(to,from,next) {
next(vm => {
vm.callMixinMethod();
})
}
}
这是有问题的,因为to
,from
,next
和vm
不会自动被分配各自的类型。
所以我需要做的是在RouteEnter之前输入@Component
@Component({
beforeRouteEnter(to,next) {
next(vm => {
vm.callMixinMethod();
})
}
})
这解决了类型的问题,它们会自动被拾取。但这带来了另一个问题。内部@Component mixin方法未定义。它说
Property 'callMixinMethod' does not exist on type 'Vue'
我试图像这样在@Component内部注册mixins:
@Component({
mixins: [myMixin],beforeRouteEnter...
})
但这没有帮助。
是否可以通过某种方式使@Component内的beforeRouteEnter钩子以某种方式查看导入的mixins的方法?也许以某种方式用mixins扩展vm
?
解决方法
我发现我们可以像这样手动分配类型给vm:
@Component({
beforeRouteEnter(to,from,next) {
next(vm: myClass & myMixin => {
vm.callMixinMethod();
})
}
})
export default class myClass extends Mixins(myMixin) {
}
myMixin看起来像这样:
@Component({})
export default class myMixin extends Vue {
public callMixinMethod() {
// do smth
}
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。