沂南网站建设,怎么查百度收录网站吗,营口seo,国家重点项目建设库网站文章目录 1. 安装相应的包2. 创建相关文件3. 构建请求 axios-mock-adapter
在前端开发中#xff0c;需要模拟请求或者数据来做一些简单的调试#xff0c;这里可以使用mock来模拟服务器接口#xff1b;
1. 安装相应的包
这里需要安装两个包#xff0c;一个是axios#x… 文章目录 1. 安装相应的包2. 创建相关文件3. 构建请求 axios-mock-adapter
在前端开发中需要模拟请求或者数据来做一些简单的调试这里可以使用mock来模拟服务器接口
1. 安装相应的包
这里需要安装两个包一个是axios一个是axios-mock-adapter
项目安装后首先在cmd中安装
npm install axios
npm install axios-mock-adapter --save-dev2. 创建相关文件
在src目录下创建mock文件夹然后在mock文件夹中放置两个文件一个server.ts一个index.ts
很明显我们是在server.ts中构造请求在index.ts中暴露
server.ts代码内容如下
import axios from axios
import MockAdapter from axios-mock-adapterexport default {bootstrap() {var mock new MockAdapter(axios)// 在这里写构造请求}
}
index.ts代码内容如下
import mock from ./server
export default mockmain.ts中添加两行
import mock from ./mock
mock.bootstrap()3. 构建请求
注意replay返回的是一个数组就好了
Get
无参数
mock.onGet(/users).reply(200, {users: [{ id: 1, name: John Smith }],
});axios.get(/users).then(function (response) {console.log(response.data);
});有参数
mock.onGet(/users, { params: { searchText: John } }).reply(200, {users: [{ id: 1, name: John Smith }],
});axios.get(/users, { params: { searchText: John } }).then(function (response) {console.log(response.data);});Post
mock.onPost(/users, { id: 1 }).reply(function (config) {console.log(config)return [200, config.data]})axios.post(/users, {id: 1}).then(result console.log(result))