Vue Test Utils - 跳过创建的钩子

Question

我想跳过 created() 挂钩中调用的所有方法。有办法吗？

所以不用这个

        created() {
            this.getAllocations();
            this.getModels();
            this.getTeams();
            this.getCustodians();
            this.getDefaultFeeStructure();
        }

我要这个

created() { }

值得注意的是，我实际上无法更改组件本身，但出于测试目的，需要这样做。

Answer 1

您可以使用全局混合来完成此操作（参见 https://vuejs.org/v2/guide/mixins.html#Global-Mixin）

但是，对于您的情况，您需要一个自定义合并策略来防止组件上创建的挂钩运行:

Hook functions with the same name are merged into an array so that all of them will be called. Mixin hooks will be called before the component’s own hooks. (https://vuejs.org/v2/guide/mixins.html#Option-Merging)

在 https://jsfiddle.net/rushimusmaximus/9akf641z/3/

查看工作示例

Vue.mixin({
  created() {
    console.log("created() in global mixin")
  }
});

const mergeCreatedStrategy = Vue.config.optionMergeStrategies.created;
Vue.config.optionMergeStrategies.created = (parent, child) => {
  return mergeCreatedStrategy(parent);
};

new Vue ({
  el: "#vue-app",
  template: '<p>See console output for logging. Rendered at {{renderDate}}</p>',
  data() {
    return {
     renderDate: new Date()
    }
  },
  created() {
    console.log("created() in component")
  }
})

Vue Test Utils - 跳过创建的钩子

Vue Test Utils - Skip created hook

vue.js

jestjs

vue-test-utils