在vue-test-utils的"mounted"生命周期钩子中测试方法调用，现在"met

Question

我的组件中有以下生命周期挂钩：

async mounted () {
await this.fetchTabData()
},

所述方法调用解耦方法，因为它请求的数据可以在运行时基于用户活动来刷新(即在每个调用异步数据的"选项卡"之间切换(

为了获得上述测试的覆盖范围，我写了以下内容：

describe('mounted', () => {
test('test', async () => {
const fetchTabData = jest.fn()
wrapper = await shallowMount(Overview, {
store: new Vuex.Store({ ... }), 
...
methods: { fetchTabData }
})
expect(fetchTabData).toHaveBeenCalled()
})
})

VTU告诉我

[vue-test-utils]：不赞成使用methods属性覆盖方法，并将在下一个主要版本中删除。methods属性没有明确的迁移路径-Vue不支持任意替换方法，VTU也不应该支持。要截断一个复杂的方法，请从组件中提取它，并对其进行隔离测试。否则，建议重新考虑这些测试。

因此，当给定的复杂方法本身是生命周期挂钩时，建议的解决方案是什么(如果有(？

Answer 1

下面通过了我的测试，警告不再出现

[编辑：为了澄清，Overview是要测试的组件]

describe('mounted', () => {
test('test', async () => {
const fetchTabData = jest.fn()
Overview.methods.fetchTabData = fetchTabData
wrapper = await shallowMount(Overview, {
store: new Vuex.Store({ ... }), 
...
})
expect(fetchTabData).toHaveBeenCalled()
})
})

理论上，同样的方法应该适用于生命周期挂钩正在调用方法的其他实例。