1、安装
npm install mockjs
2、在src文件下
创建mock文件夹
在mock文件夹下创建json文件 并在json文件夹下创建index.json
在mock文件下创建mock.js文件
3、在mian.js文件中引用mock.js
import "./mock/mock.js";
mock.js文件中的内容
```
import Mock from 'mockjs'
Mock.setup({
timeout: 500 //设置一个延迟时间虚拟服务器响应效果
})
//格式： Mock.mock( url, post/get , 返回的数据)； Mock.mock('/getList', 'get', require('./json/index.json'))
// 通过Mock.mock函数模拟post请求
Mock.mock('/api/addgoods', 'post', function (option) {
// 这里的option是请求的相关参数
var $name=JSON.parse(option.body).name;
if($name){
return Mock.mock({
status: 200,
message: '提交成功！！！'
})
}else{
return Mock.mock({
status: 400,
message: '未提交参数'
})
}
})
```
index.json文件中的内容
```
{
"retcode": "0000",
"retmsg": "成功",
"data": [
{
"tabId": 1,
"tabShowName": "推荐",
"tabName": "recommend"
},
{
"tabId": 2,
"tabShowName": "7×24",
"tabName": "7x24"
},
{
"tabId": 3,
"tabShowName": "观点",
"tabName": "opinion"
}
]
```
3、发送请求并获取数据此处用的是axios
方式一：发送get请求
```
this.$axios.get('/getList').then((res)=>{
console.log(res)
})
```
方式二：发送post请求
```
var data={
name:"张三"
}
this.$axios.post("/api/addgoods",data).then(res=>{
console.log(res,"MOCK __ POST")
})
```
4、附上官网链接
https://github.com/nuysoft/Mock/wiki
5、目录结构
6、完结😁
