vue的mixins混入能否做到部分组件全局混入？

Question

比如我有两级菜单

user:{
    child:[
        {detail},
        {update}
    ]
}

order:{
    child:[
        {add},
        {delete}
    ]
}

我想给所有所有 user路由下面的子路由混入一个 mounted;

不能影响到 order路由，

我在main.js里面用了全局混入，发现连我引入的第三方库都会影响到

Answer 1

vue没有提供直接方法，但要实现起来并不难，比较简单的办法是在全局mixin方法里面加判断

比如这样

Vue.mixin({
  mounted() {
    if (this.mixinActive) {
      console.log('mixin');
    }
  },
});

只有组件中data预设了mixinActive: true才会执行，当然这个判断也可以过this.$options.name判断组件名，或者this.$route判断路由来确定

Answer 2

你在user 路由 地方局部混入不就好了么？

// user
<script>
   export default {
        mixins: [xxx]
   }
</script>

Answer 3

全局 mixin 顾名思义就是全局的，你在问题描述中的需求与全局不符，因此不能这么使用。

如果想要达到类似的效果，请使用 vue 提供的 provide/inject 依赖注入 api，这种应该可以达到全局注入依赖，局部按需注入的要求。