故事书中有两次Stub axios
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了故事书中有两次Stub axios相关的知识,希望对你有一定的参考价值。
[我有几个使用Axios调用的组件,我试图“存根”那些功能,但是,在故事书“尝试包装已经包装的get上,我收到以下错误”。
我想知道是否有一种方法可以定义存根多次,因为我尝试在每个compXX.stories.js的末尾使用sinon.reset(),但它不起作用。
以下是一些代码:
comp123.stories.js
import VueCustomElement from 'vue-custom-element';
import Vue from 'vue';
import sinon from 'sinon';
import axios from 'axios';
import * as rawJSON from './123-response.json';
import comp123 from 'comp123';
Vue.use(VueCustomElement);
const aStub = sinon.stub(axios, 'get').resolves(Promise.resolve(
rawJSON.default
));
export default {
title: '123 component',
component: comp123,
decorators: [withA11y],
};
export const Base = () => ({
components: {comp123},
template: `<div class="comp123"> ...component123
</div>
`,
});
comp345.sories.js
import VueCustomElement from 'vue-custom-element';
import Vue from 'vue';
import sinon from 'sinon';
import axios from 'axios';
import * as 345response from './345-response.json';
import comp345 from 'comp345';
Vue.use(VueCustomElement);
const aStub = sinon.stub(axios, 'get').resolves(Promise.resolve(
345response.default
));
export default {
title: '345 component',
component: comp345,
decorators: [withA11y],
};
export const Base = () => ({
components: {comp345},
template: `<div class="comp345"> ...component345
</div>
`,
});
答案
对于错误“尝试包装已经包装的get”,您需要检查this。关键是:如果要再次存根相同的方法,无论是否带有sandbox,都需要还原而不是重置。
对于axios存根/模拟:通常我使用axios-mock-adapter,可能更适合您的情况。
以上是关于故事书中有两次Stub axios的主要内容,如果未能解决你的问题,请参考以下文章
VSCode自定义代码片段14——Vue的axios网络请求封装
VSCode自定义代码片段14——Vue的axios网络请求封装