veu中mock.js的使用

在项目的main.js文件中注册使用mock

import './mock/mockServer'

发送请求页

发送一个axios请求得到返回数据(mock)
methods:{
	//请求获取mock生成的数据
	addData(){
		axios.get('msg').then(res=>{
			this.list = res.data;
			var arrs = this.list.splice(4,this.list.length-4)
			this.list2 = arrs
			console.log(res.data);
		})
	},
}

mock拦截请求,返回随机数据

随机生成图片,添加随机字段
// 根据mock js 提供mock数据接口
import Mock from 'mockjs'
 
const Random = Mock.Random;
export default Mock.mock('msg', function(){  	
	// imgs:Random.dataImage('375x370'),
let result = [{text1:Random.ctitle(20,100)},{text2:Random.ctitle(20,100)},{text3:Random.float(60, 100, 2, 2)},{text4:Random.integer(10,20)},]
	for( let i=0;i< (Math.floor(Math.random()*20) +5); i++){
		let obj = {
			img:Random.dataImage('375x370'),
			
		}
		result.push(obj);
	}
	return result
});  
 
返回数据打印

veu中mock.js的使用_第1张图片

你可能感兴趣的:(vue)