在开发过程中,有时候接口跟不上我们的进度,我们要测试,就需要自测。

现在vue已经升级到2.0版本了,早期在vue构建工程文件在build里面有dev-server.js,但是后来构建去除了该文件集成到了webpack的webpack.dev.conf.js里面。希望对大家有帮助。

1、先编写模拟数据

在本目录配置一个data.json的文件,具体的自己配置,也不难。

2、编写接口模块

进入webpack.dev.conf.js文件,在Number(process.env.PORT)后面写入以下代码:

const express = require('express')
const app = express()
var appData = require('../data.json')
const seller = appData.seller
const goods = appData.goods
const ratings = appData.ratings
var apiRouter = express.Router()
app.use('/api',apiRouter)
 
再找到同文件下devServer模块,在模块内写入

具体代码如下:

before(app) {
app.get('/api/seller', function(req, res) {
res.json({
errno: 0,
data: seller
})
});
app.get('/api/goods', function(req, res) {
res.json({
errno: 0,
data: goods
})
});
app.get('/api/ratings', function(req, res) {
res.json({
errno: 0,
data: ratings
})
});
}

模拟接口配置就已经完成,然后打开cmd,进入项目目录,输入:npm run dev,启动项目

输入:localhost:8080/api/goods

vue2.0中模拟数据的配置的更多相关文章

  1. Vue2.0中的路由配置

    Vue2.0较Vue1.0,路由有了较大改变.看一下Vue2.0中的路由如何配置: 步骤一: 在main.js文件中引入相关模块以及组件及实例化vue对象配置选项路由及渲染App组件 默认设置如下: ...

  2. Vue2.0 中,“渐进式框架”和“自底向上增量开发的设计”这两个概念是什么?(转)

    https://www.zhihu.com/question/51907207?rf=55052497 徐飞 在我看来,渐进式代表的含义是:主张最少. 每个框架都不可避免会有自己的一些特点,从而会对使 ...

  3. router-view在vue2.0中不显示,解决方法

    学习的router-view路由一直不显示,我翻看vue文档,花费1个小事终于找到原因,希望我的问题能给初学的同学,带来福音,版本不一样,真的烦 在此总结记录,以免以后在此遇到此问题 //配置路由 c ...

  4. vue2.0中使用pug(jade)

    第一部分:pug(jade)模板引擎 pug,原名jade,是流行的HTML模板引擎,它是HAML在JavaScript上的实现,最大的特色是使用缩进排列替代成对标签. 它简化了HTML的成对标签的写 ...

  5. vue2.0中使用less

    第一部分:Less语言 与上一篇<vue2.0中使用sass>介绍的Sass语言一样,Less语言也是一种CSS的扩展语言,增加了变量.混合(minin).函数等功能,让CSS更易维护.方 ...

  6. vue2.0中使用sass

    第一部分:Sass语言 Sass是一种强大的css扩展语言(css本身并不是一门语言),它允许你使用变量.嵌套规则.mixins.导入等css没有但开发语言(如Java.C#.Ruby等)有的一些特性 ...

  7. vue2.0 中#$emit,$on的使用详解

    vue1.0中 vm.$dispatch 和 vm.$broadcast 被弃用,改用$emit,$on 1. vm.$on( event, callback ) 监听当前实例上的自定义事件.事件可以 ...

  8. vue2.0中 怎么引用less?

    vue2.0中  怎么引用less? 第一步: 安装less依赖, npm install less less-loader --save 第二步: 修改webpack.config.js文件,配置l ...

  9. vue2.0中router-link详解

    vue2.0中router-link详解:https://blog.csdn.net/lhjuejiang/article/details/81082090 在vue2.0中,原来的v-link指令已 ...

随机推荐

  1. CocoaPods 私有化

    一.创建所需要的代码仓库 创建 Spec 私有索引库(ZFSpec),用来存放本地spec 创建模块私有库(ZFPodProject),用来存放项目工程文件 二.私有索引库添加到本地 CocoaPod ...

  2. 微信小程序云开发-数据条件查询

    一.使用where条件查询 在.get()语句之前增加.where语句实现条件查询.  二.通过doc查询单条数据 1.使用doc来查询数据库中的单条数据 2.定义一个空对象,用来展示插叙到的单条数据 ...

  3. 深入刨析tomcat 之---第14篇 对应19章,使用manager管理 web应用

    writedby 张艳涛 第19章讲的是管理程序,当一个tomcat启动的时候,能通过远程浏览器能访问tomcat,启动web应用,关闭web应用,查看web应用 怎么实现的呢? 在webapp 文件 ...

  4. php 随机生成字符串

    private function createNonceStr($length = 16) { $chars = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJK ...

  5. JBoss JMXInvokerServlet 反序列化漏洞

    poc地址:https://cdn.vulhub.org/deserialization/DeserializeExploit.jar

  6. JS替换字符

    var msg='A|B|C|D|E|F|G'; 方式1: var newMsg=msg.replace("|",""); 方式2: ps:适用特殊字符 var ...

  7. SpringBoot数据访问之Druid启动器的使用

    数据访问之Druid启动器的使用 承接上文:SpringBoot数据访问之Druid数据源的自定义使用 官方文档: Druid Spring Boot Starter 首先在在 Spring Boot ...

  8. 2020年度钻石C++C学习笔记(2)--《博学谷》

    2020年度钻石C++C--<博学谷> 1.以下标示符中命名合法的是A A.__A__ B.ab.c C.@rp D.2Y_ 2.设 a 和 b 均为 double 型变量,且a=5.5. ...

  9. 安装CDH6.2 agent报错

    界面报错信息提示如下: file /opt/cloudera/parcels/.flood/CDH-6.2.0-1.cdh6.2.0.p0.967373-el7.parcel...does not e ...

  10. thunderbird发送纯文本邮件

    向邮件列表中发邮件时,要求邮件格式必须是纯文本格式的,在thunderbird中,邮件格式(plain text或者html格式)在[工具->账户设置->[账户名称]->通讯录]下的 ...