如何将mixin动态注入组件

Question

我有一个组件需要mixin取决于它收到的道具.

const timerMixin = {
    created() {
        console.log("Timer mixin injected")
    }
}

export default {
    name: 'Component A',
    props: ['hasTimer'],
    mixins: this.hasTimer ? [timerMixin] : [] // fails because `this` is not available here 
}

有没有办法动态地将mixin注入组件？

Answer 1

不幸的是，目前还没有办法动态添加或删除组件的 mixin。varthis在该范围内不可用。并且在最早的生命周期钩子中，beforeCreatemixins已经被加载了。

在您的情况下，根据timerMixinmixin 中的内容，制作一个具有相关逻辑的单独计时器组件可能是有意义的，该组件可以在Component A.

否则，总是加载 mixin 可能不会太糟糕（性能方面），因为数据将是反应性的。