vue项目中使用mock.js模拟数据
2018-08-15 15:39
701 查看
注:mock.js基础教程可参见 https://www.geek-share.com/detail/2745321448.html
安装
命令行输入 cnpm install mockjs
在main.js同级新建mockjs文件
内容如下:
[code]const Mock=require('mockjs'); //引入mockjs文件 var template={ 'data|1-4':[{ 'title':'@title', 'article':'@article' }] } var template1={ 'data|1-4':[{ 'title':'小王', 'article':'赵四' }] } Mock.mock('/api/data',template); //网址自定义,和请求路径相同即可 Mock.mock('/api/data1',template1);
在main.js中引入mock文件
require('./mock');
在你要使用的vue文件中调用接口
[code]$.ajax({ type:'POST', url:'/api/data1', //url 路径和自建的mock.js文件中的网址保持一致 dataType:'json', success:function(res){ console.log(res.data); } })
阅读更多
相关文章推荐
- vue创建项目build的文件夹下没有dev-server.js文件了,怎么mock数据?
- 详解vue-cli项目中怎么使用mock数据
- 前端数据模拟 Mock.js 使用教程
- Mock.js 模拟ajax数据 使用
- 简单的使用mock.js模拟数据,拦截ajax请求
- vue-cli项目如何使用vue-resource获取本地的json数据(模拟服务端返回数据)
- 前端数据模拟---mock.js 使用教程
- vue.js项目的mock数据配置
- 使用mock.js提供模拟数据
- 如何在Vue项目中使用Mockjs,模拟接口返回的数据,实现前后端分离独立开发
- vue项目中使用mockjs模拟接口返回数据
- 使用express+mockjs搭建服务器和模拟数据
- Vue项目 五、表现->5.2数据模拟
- Vue.js:使用vue-cli快速构建项目
- vue.js中请求数据v-for循环使用数据
- Vue.js学习系列(四十三)-- 使用props传递数据
- Atitit 项目界面h5化静态html化计划---vue.js 把ajax获取到的数据 绑定到表格控件 v2 r33.docx
- 使用阿里Rap实现mock数据(模拟后台数据)
- Vue.js动画在项目使用的两个示例