在vue-cli脚手架项目中,找到build ---- webpack.dev.conf.js 文件,具体位置如下图:

找到文件后添加下面的内容,写在头部:

//这是 webpack.dev.conf.js 文件里的
'use strict'

/*新版的vue-cli代替原来的dev-server.js文件,现在在这里可以简单配置node请求,获取一些本地数据 */
const express = require("express");//需要先npm install --save express
const app = express();
const appData = require("../data.json"); //data.json,就是本地的模拟数据
const appRoutes = express.Router();
appRoutes.get("/seller", function(req, res) {
res.json({
errno: 0,
data: appData.seller
})
});
appRoutes.get("/ratings", function(req, res) {
res.send({
errno: 0,
data: appData.ratings
})
});
appRoutes.get("/goods", function(req, res) {
res.send({
errno: 0,
data: appData.goods
})
}); //app.use("/api", appRoutes); /*结束 */

然后还是在当前文件进行修改,找到 devWebpackConfig 下面的 devServer 的配置进行修改,如下:

 devServer: {
//这里是在建立本地传数据的时候需要修改的
before(app) {
app.use("/api", appRoutes);
},
........ //下面的配置不用修改,这里省略
}

vue 2.0+ 怎么写本地接口获取数据的更多相关文章

  1. vue 配合vue-resource调用接口,获取数据

    1.先用node+express+mysql简单配置一下后台 const express = require('express');const mysql = require('mysql');con ...

  2. Vue事件 定义方法执行方法 获取数据 改变数据 执行方法传值 以及事件对象

    <template> <div id="app"> <!-- <img v-bind:src='url' /> <img :src= ...

  3. vue.js--基础事件定义,获取数据,执行方法传值

    <template> <div id="app"> <h1>{{ msg }}</h1> <br> <button ...

  4. VUE通过索引值获取数据不渲染的问题

    问题:vue里面当通过索引值获取数据时,ajax数据成功返回,但是在火狐下不渲染 解决:

  5. Vue 2.0基础语法:系统指令

    本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. Vue初体验 新建一个空的项目,引入vue.js文件.写如下代码: &l ...

  6. 使用Vue.js和Axios从第三方API获取数据 — SitePoint

    更多的往往不是,建立你的JavaScript应用程序时,你会想把数据从远程源或消耗一个[ API ](https:/ /恩.维基百科.org /维基/ application_programming_ ...

  7. vue ajax获取数据的时候,如何保证传递参数的安全或者说如何保护api的安全

    https://segmentfault.com/q/1010000005618139 vue ajax获取数据的时候,如何保证传递参数的安全或者说如何保护api的安全 点击提交,发送请求.但是api ...

  8. vue模拟后端获取数据——json-server与express

    转载自: https://blog.csdn.net/weixin_39728230/article/details/80293892 https://blog.csdn.net/lxkll/arti ...

  9. 在Vue中使用了Swiper ,动态从后台获取数据的之后,swiper滑动失效??

    在Vue中使用了Swiper ,动态从后台获取数据的之后,swiper滑动失效?? 是因为swiper提前初始化了,那时候数据还没有完全出来.这里有两种解决办法 1. 使用vue提供的$nextTic ...

随机推荐

  1. 最新解决Chrome(版本76.0.3809.100) “请停用以开发者模式运行的扩展程序”的方法

    最新解决Chrome(版本76.0.3809.100) “请停用以开发者模式运行的扩展程序”的方法 最近在远景论坛上发现了最新的解决Chrome浏览器提示:请停用以开发者模式运行的扩展程序的问题.该方 ...

  2. myadmin不需要路劲提权之法

    //觉得很典型的案例,就转载过来了.很多时候phpmyadmin都需要路劲才能写shell.否则拿到了myadmin也是无奈. 查看mysql版本 select version(); 版本是5.1 大 ...

  3. Spring为什么@Autowired注入的是接口

    1.Spring怎么知道注入哪个实现? As long as there is only a single implementation of the interface and that imple ...

  4. PHP松散比较与严格比较的区别详解

    在PHP中相等的比较有两种,松散比较和严格比较,当使用松散比较时,如果进行比较的两个操作数类型不同,那么会对操作数进行适当的类型转换,如果转换后的值相同则认为两个操作数相等.而使用严格比较时,如果两个 ...

  5. 18Flutter中的路由、路由替换、返回到根路由:

    路由: 正常跳转: Navigator.pushNamed(context,'/product');   路由替换: Navigator.pushReplacementNamed(context, ' ...

  6. 123457123456---com.threeObj3.BabyShizi02--- 宝宝识字02

    com.threeObj3.BabyShizi02--- 宝宝识字02

  7. vmware安装centos7.5、配置网卡、环境配置

    1.vmware安装centos7.5虚拟机    参考连接: https://blog.csdn.net/guo_ridgepole/article/details/78973763 可能遇到的问题 ...

  8. LODOP打印超文本字符串拼接1 固定表格填充数值

    前面的博文:Lodop打印控件传入css样式.看是否传入正确样式.Lodop打印如何隐藏table某一列,Lodop传入的样式可以不是页面本身的css样式,传入什么打印什么,此外,数据也是,超文本打印 ...

  9. ubuntu 12.04 下LVS的一些搭建心得和资料整理

    最近项目上需要使用到IPVS进行负载均衡,针对外部传来的HTTP请求,分摊到多台服务器上进行处理,所以看了一下这方面的资料,在这里纪录一下. Lvs是基于IP层和内容分发请求的负载均衡方法(所以也可以 ...

  10. 【ARM-Linux开发】Wi-Fi 应用工具wpa_supplicant

    wpa_supplicant是一个跨平台的无线安全管理软件,这里需要用它来对无线网络进行配置,wpa_supplicant相关工具已经移植好,包含在我们提供的文件系统中. 配置无线网络 wpa_sup ...