在加载之前更改模块内的 VUE 组件

Question

我有这样的组件：

<template>
  <div>
    <some-module />
  </div>
</template>
<script lang="ts">
  import { Vue, Component, Prop } from 'vue-property-decorator';
  import SomeModule from '../../node_modules/somemodule/SomeModule.vue'
  import MyComponent from 'MyComponent.vue'

  @Component({
    components: {
        SomeModule
     }
  })
  export default class AppMyRootComponent extends Vue {
  }
</script>

而且我知道这个模块有子组件，所以这个模块可能是这样的：

<template>
  <div>
    <module-component />
  </div>
</template>
<script lang="ts">
  import { Vue, Component, Prop } from 'vue-property-decorator';
  import ModuleComponent from 'ModuleComponent'

  @Component({
    components: {
        ModuleComponent
     }
  })
  export default class SomeModule extends Vue {
  }
</script>

我需要在源代码不变的情况下使用SomeModule，但是我需要在使用时将ModuleComponent更改为MyComponent。

Answer 1

最简单的方法是编写自己的类扩展这个模块，并在项目中使用自己的类。我可以提供自己的内部组件来改变原来的。