1、src下新建mock文件夹,mock文件夹下新建response目录 ,造后台接口数据,输出getUserInfo
import Mock from ‘mockjs’
const Random = Mock.Random
export const getUserInfo = (options) => {
const userInfo = []
for (let i = 0; i < 10; i++) {
const template = {
‘name’: Random.cname(),
‘age’: Random.natural(22, 40),
‘date’: Random.date(‘yyyy-MM-dd’),
‘address’: Random.county(true)
}
userInfo.push(template)
}
2、mock下新建index.js
import Mock from ‘mockjs’
import { getUserInfo } from ‘./response/user’
//第一个参数接口路径,第二个参数请求方式,第三个参数返回数据
const data = Mock.mock(//getUser/, ‘post’, getUserInfo)
// 设置响应延时
Mock.setup({
timeout: 5000
})
export default data
3、vue组件中使用,用axios请求
import axios from ‘axios’
//这里的url和method和第二步中定义的一致
axios.request({
url: ‘/getUser’,
method: ‘get’
}).then(res => {
this.res = res.data
}).catch(e => {
})