- 引入mock.js
cnpm install mockjs --save-dev
- 在src目录下,创建mockjs目录,在目录下新建文件mock.js
src --- mockjs ------ mock.js
- 在mock.js中引入mockjs模块,然后配置需要拦截的接口,以及定义相应的模拟数据,代码如下:
const Mock = require('mockjs') const base = 'https://dev-api-whale.codemao.cn' const Random = Mock.Random; Mock.mock(base+'/api/mock','get',{ 'name':'@name', 'age|1-100':100, 'color':'@color', 'thumbnail_pic_s': Random.dataImage('300x250', 'mock的图片') })
- 拦截配置做好后,在main.js中导入mock.js文件:
require('./mockjs/mock.js')
- 然后就可以像线上一样,正常访问接口:
API.get('/api/mock').then((res) => { console.log("mock", res) if (res.status === 200) { this.theme_options = res.data.items } })
- 页面启动后,控制台就会打印,如下:
Vue使用Mock
猜你喜欢
转载自blog.csdn.net/doStruggle/article/details/83820848
今日推荐
周排行