vue-resource + json-server模拟数据的方法


Posted in Javascript onNovember 02, 2017

本文介绍了vue-resource + json-server模拟数据,分享给大家,具体如下:

一、安装

npm install vue-resource --save
npm install json-server --save

二、配置与使用vue-resource

// main.js
import VueResource from 'vue-resource'
Vue.use(VueResource)
   this.$http.get('api/getNewsList')
    .then(function (data) {
     console.log(data)
    }, function (err) {
     console.log(err)
    })

三、配置 json-server

// dev-server.js
var jsonServer = require('json-server')
var apiServer = jsonServer.create()
var apiRouter = jsonServer.router('db.json')
var middlewares = jsonServer.defaults()

apiServer.use(middlewares)
apiServer.use('/api', apiRouter)
apiServer.listen(port + 1, function () {
 console.log('JSON Server is running')
})
// config/index.js
dev:{
  ...
  proxyTable: {
   '/api/': 'http://localhost:8081/'
  },
  ...
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript变量作用域使用中常见错误总结
Mar 26 Javascript
主页面中的两个iframe实现鼠标拖动改变其大小
Apr 16 Javascript
JavaScript中的getMilliseconds()方法使用详解
Jun 10 Javascript
在Html中使用Requirejs进行模块化开发实例详解
Apr 15 Javascript
浅谈jquery的map()和each()方法
Jun 12 Javascript
Bootstrap三种表单布局的使用方法
Jun 21 Javascript
Vue.js常用指令汇总(v-if、v-for等)
Nov 03 Javascript
JQuery实现定时刷新功能代码
May 09 jQuery
在原生不支持的旧环境中添加兼容的Object.keys实现方法
Sep 11 Javascript
JavaScript学习笔记之图片库案例分析
Jan 08 Javascript
详解React项目中碰到的IE问题
Mar 14 Javascript
微信小程序scroll-view锚点链接滚动跳转功能
Dec 12 Javascript
详解vue-cli项目中用json-sever搭建mock服务器
Nov 02 #Javascript
Vue-cli 使用json server在本地模拟请求数据的示例代码
Nov 02 #Javascript
vue项目中使用axios上传图片等文件操作
Nov 02 #Javascript
JavaScript登录验证基础教程
Nov 01 #Javascript
vue打包后显示空白正确处理方法
Nov 01 #Javascript
js实现登录与注册界面
Nov 01 #Javascript
vue仿淘宝订单状态的tab切换效果
Jun 23 #Javascript
You might like
thinkphp的静态缓存用法分析
2014/11/29 PHP
33道php常见面试题及答案
2015/07/06 PHP
PHP排序算法之堆排序(Heap Sort)实例详解
2018/04/21 PHP
翻译整理的jQuery使用查询手册
2007/03/07 Javascript
jQuery纵向导航菜单效果实现方法
2016/12/19 Javascript
Base64(二进制)图片编码解析及在各种浏览器的兼容性处理
2017/02/09 Javascript
Bootstrap 设置datetimepicker在屏幕上面弹出设置方法
2017/03/21 Javascript
详解JavaScript中return的用法
2017/05/08 Javascript
详解Vue的computed(计算属性)使用实例之TodoList
2017/08/07 Javascript
你可能不知道的前端算法之文字避让(inMap)
2018/01/12 Javascript
angular6.0使用教程之父组件通过url传递id给子组件的方法
2018/06/30 Javascript
基于jQuery ztree实现表格风格的树状结构
2018/08/31 jQuery
vue 项目中当访问路由不存在的时候默认访问404页面操作
2020/08/31 Javascript
vue使用vue-quill-editor富文本编辑器且将图片上传到服务器的功能
2021/01/13 Vue.js
python paramiko实现ssh远程访问的方法
2013/12/03 Python
Python while 循环使用的简单实例
2016/06/08 Python
Python数据结构与算法之完全树与最小堆实例
2017/12/13 Python
python在每个字符后添加空格的实例
2018/05/07 Python
python发送告警邮件脚本
2018/09/17 Python
如何在python中写hive脚本
2019/11/08 Python
python实现多进程按序号批量修改文件名的方法示例
2019/12/30 Python
Python 实现训练集、测试集随机划分
2020/01/08 Python
Python操作Jira库常用方法解析
2020/04/10 Python
Python 基于jwt实现认证机制流程解析
2020/06/22 Python
python 爬取小说并下载的示例
2020/12/07 Python
使用 css3 transform 属性来变换背景图的方法
2019/05/07 HTML / CSS
HTML5本地存储之Web Storage详解
2016/07/04 HTML / CSS
HTML5 FileReader对象的具体使用方法
2020/05/22 HTML / CSS
美国学校校服,儿童和婴儿服装:Cookie’s Kids
2016/10/14 全球购物
艺术家策划的室内设计:Curious Egg
2019/03/06 全球购物
播音主持专业个人自我评价
2014/01/09 职场文书
亲子运动会的活动方案
2014/08/17 职场文书
税务干部群众路线教育实践活动对照检查材料
2014/09/20 职场文书
迟到检讨书
2015/01/26 职场文书
MySQL kill不掉线程的原因
2021/05/07 MySQL
详解JS WebSocket断开原因和心跳机制
2021/05/07 Javascript