B栈跟着老师视频自学,仅供参考~~~
基本使用
在项目中创建mock目录,新建index.js文件
//引入mockjs
import Mock from 'mockjs'
//使用mockjs模拟数据
Mock.mock('/product/search',{
"ret":0,
"data":{
"mtime":"@datetime" , //随机生成日期时间
"score|1-800":800, //随机生成1-800的数字
"rank|1-100":100,
"stars|1-5":5,//随机生成1-5的数字
"nickname":"@cname",//随机生成中文名字
}
}) ;
组件中调用mock.js中模拟的数据接口,这时返回的response就是mock.jd中用Mock.mock(
'url',data)中设置的data
import axios from 'axios'
export default{
mounted: function(){
axios.get("/product/search").then(res =>{
console.log(res)
})
}
}
核心方法
Mock.mock(rurl?,rtype?,template|function(options))
rurl需要拦截的URL,可以是URL字符串或URL正则
rtype需要拦截的Ajax请求类型,例如GET,POST,PUT,DELETE等
template表示数据模板,可以是对象或字符串
function表示用于生成响应数据的函数
设置延时请求到数据
//延时400ms请求到数据
Mock.setup({
timeout: 400
})
//延时200-600毫秒请求到数据
Mock.setup({
timeout: '200-600'
})
数据生成规则
mock的语法 规范包含两层规范:数据模板DTD,数据占位符DPD
数据模板中的每个属性由三个部分组成,属性名name,生成规则rule,属性值value
'name|rule':value
属性名和生成规则之间用竖线|分隔,生成规则是可选的,有7中格式: