1. 在根目录下创建 test 目录, 用来存放模拟的 json 数据, 在 test 目录下创建模拟的数据 data.json 文件

2.在build目录下的 dev-server.js的文件作如下更改

var appData = require('../test/data.json')
// 获取数据
var apiRoutes = express.Router();

//get请求
apiRoutes.get('/seller',function(req,res){
res.send({
appData
});
});

app.use('/api',apiRoutes);

3. 在.vue做请求, 就可以成功获取data.json的数据了, 下面使用 axios 进行请求axios.get('/api/seller',{

          params: {
ID: 12345
}
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
 请求成功, 获取到数据 4. 如过要做post请求, 需要对 dev-server.js 文件做对应的修改
apiRoutes.post('/seller',function(req,res){
res.send({
appData
});
});
这样就可以在vue 项目中进行模拟 ajax 请求了

在vue项目中, mock数据的更多相关文章

  1. 在vue项目中mock数据

    第一步:安装: 在命令行中执行: npm install mockjs; 第二步:定义index.js文件 我们新建一个mock文件夹,此文件夹中建一个index.js文件:在index.js中输入以 ...

  2. vue 项目中如何在页面刷新的状态下保留数据

    1.问题:在vue项目中,刷新页面之后,我当前打开的所有菜单,都消失,我如何实现刷新之后页面仍然是刷新之前的状态 效果图: 解决方法: 使用vuex作状态管理: 将vuex里面的数据同步更新到loca ...

  3. Vue项目中v-for无法渲染数据

    在Vue项目中,我们想要实现下面的布局效果 后端返回的数据格式如下,可以看出产品列表五张图的数据位于同一个数组中 而我的html结构如下: 我希望直接渲染左边一张大图,然后右边的四张小图通过v-for ...

  4. vue项目配置Mock.js

    扯在前面 最近一直在忙跳槽的事情,博客也好久没有更新了,上次更新还是去年,不出意外的话,从今天起继续今年的博客之旅. 今天继续完善我之前的项目架构,从零开始搭建vue移动端项目到上线,有需要的同学可以 ...

  5. 浅谈 Axios 在 Vue 项目中的使用

    介绍 Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中. 特性 它主要有如下特性: 浏览器端发起XMLHttpRequests请求 Node端发起http ...

  6. vue项目中遇到的那些事。

    前言 有好几天没更新文章了.这段实际忙着做了一个vue的项目,从 19 天前开始,到今天刚好 20 天,独立完成. 做vue项目做这个项目一方面能为工作做一些准备,一方面也精进一下技术. 技术栈:vu ...

  7. 在vue项目中使用axios发送FormData

    这个是axios的中文文档,挺详细的: https://www.kancloud.cn/luponu/axios/873153 文档中的    使用 application/x-www-form-ur ...

  8. Vue项目中使用Vuex + axios发送请求

    本文是受多篇类似博文的影响写成的,内容也大致相同.无意抄袭,只是为了总结出一份自己的经验. 一直以来,在使用Vue进行开发时,每当涉及到前后端交互都是在每个函数中单独的写代码,这样一来加大了工作量,二 ...

  9. vue项目中遇到的一些问题

    或访问:https://github.com/littleHiuman/experiences-about-vue  欢迎补充! vuex 状态 vue-cli 命令行 vue vue vue-rou ...

随机推荐

  1. linux常用命令汇总(更新中...)

    文本查看与编辑 1.文本编辑命令 vi/vim 2.查看文件内容命令 命令 说明 命令格式 参数 cat 将一个文件的内容连续输出在屏幕上 cat [-option]  文件名 -n:将行号一起显示在 ...

  2. redis配置文件详解及实现主从同步切换

    原理:redis复制是怎么进行工作 如果设置了一个slave,不管是在第一次链接还是重新链接master的时候,slave会发送一个同步命令 然后master开始后台保存,收集所有对修改数据的命令.当 ...

  3. 《UNIX网络编程 卷1:套接字联网API》读书笔记(一):网络编程简介

    概述 要编写通过计算机网络通信的程序,首先要确定这些程序相互通信所用的协议.大多数网络是按照划分成客户和服务器来组织的.本章及后续章节的焦点是TCP/IP协议族,也可称为网际协议族.下图为客户与服务器 ...

  4. http的CA证书安装(也就是https)

    近几年随着安全意识的提高,https流行起来,很多小伙伴不太了解https是什么,其实http和https并没有区别,简单的来说,https就是将http通信进行了加密和解密的一个过程.加上谷歌浏览器 ...

  5. 20162328蔡文琛week04

    学号 20162328 <程序设计与数据结构>第4周学习总结 教材学习内容总结 本周学习了第四章和第七章,第四章中的内容已经有了初步定的掌握,布尔表达式的运用,是条件和循环语句的基础及数组 ...

  6. 201621123027 Week02-Java基本语法与类库

    Week02-Java基本语法与类库 1.本周学习总结 关键词:基本语法,数据类型,包装类 本周讲了Java的基本数据类型和包装类: 数据类型主要分为八类(byte,short,int,long,do ...

  7. 一个CSS简单入门网站

    讲的知识简单明了,很实用: http://zh.learnlayout.com/

  8. javascript学习(4)异常处理 try-catch 和 onerror

    一.try-catch 1.样例1 1.1.源代码 1.2.执行后 2.样例2 2.1.源代码 2.2.执行后 二.onerror 1.源代码 2.执行后

  9. ELK学习总结(1-3)倒排索引

    1.倒排索引(反向索引) 一种索引方法,用来存储在全文检索下某个单词在一个/组文档中的存储位置. 常规索引,文档->关键词,费时,得把一个文档全部遍历一遍 倒排索引,关键词->文档,全文搜 ...

  10. T410升级笔记

      T410 win7 旗舰版 32 sp1 三星  DDR3 1066 mhz core i5 M 540 2.53GHZ 双核 日立 HTS725032A9A364 320G/7200转/分 sa ...