vue请求本地自己编写的json文件。
1.第一步,这是目录结构

2.接下来是build/webpack.dev.conf.js文件需要配置的内容

代码:
//vue配置请求本地json数据
const express = require('express')
const app = express()
const appData = require('../static/major_info.json')//加载本地json文件
const majorlist = appData.contents;//获取本地对应数据
const apiRoutes = express.Router()
app.use('/api',apiRoutes)

代码:
before (app) {
app.get('/api/majorlist',(req, res) => {
res.json({
erron:0,
data: majorlist
})//接口返回json数据,上面配置的数据majorlist就赋值给data请求后调用
})
}
3.接下来就是vue文件的请求写法:

代码:
created(){
let _this = this;
this.$http.get("/api/majorlist").then(function(response){
// console.log(response.data.data);
let data = response.data.data;
for(let i = 0; i < data.length; i++){
if(this.majorIndex == data[i].type){
this.dataList = data[i];
}
}
})
.catch(function(error){
console.log("出错喽:"+error);
});
}
4.这是我的json文件数据格式

vue请求本地自己编写的json文件。的更多相关文章
- vue请求本地json数据
1.下载vue-resource插件 cnpm install vue-resource 1.2全局引入vue-resource: 在main.js import VueResource from ' ...
- VUE请求本地数据的配置json-server
VUE开发请求本地数据的配置,早期的vue-lic下面有dev-server.js和dev-client.js两文件,请求本地数据在dev-server.js里配置,最新的vue-webpack-te ...
- vue脚手架用axios请求本地数据
首先需要声明的是:本地请求,不用考虑跨域问题,这适用刚入坑的前端小白看,小白在做自己的项目时,通常都是用自己写的json数据,之后用axios请求过来,渲染到页面上. 1.cnpm install a ...
- 从MongoDB里面取得json格式的数据,然后存为本地的json文件,然后再从json读取变为dict
帮宣传下彩印网(www.caiyin.com) 有印刷,广告等等方面的需求就找这个网站吧,没错的. 天气预报在MongoDB中的天气预报的存储方式是: /* 1 */ { "_id" ...
- ios -本地存储和查看json数据
1.代码创建json文件,并保存到本地 第一步.设置json文件的保存路径 NSString *filePath = [NSHomeDirectory() stringByAppendingStr ...
- jQuery访问json文件
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 从接口自动化测试框架设计到开发(二)操作json文件、重构json工具类
用例模板里的请求数据多,看起来很乱,所以可以通过访问另外一个文件的方式获取请求数据 把请求数据都放在一个json文件中 取出login的内容: import json fp = open('G:/un ...
- 如何在vue中请求本地json文件
1..修改webpack.base.conf.js 文件中添加'/static': resolve('static'),如下所示,此时存放于static的json文件就可以通过/static/xxx. ...
- vue使用axios请求本地json文件出现404
之前的路径是这么写的,一直出现404,后来发现必须是http的才可以,这样是无法请求的 把路径改为以下 位置根据json文件决定,但是必须是http://localhost:断口号
随机推荐
- CentOS7系列--2.2CentOS7中配置SSH服务
CentOS7配置SSH服务 1. SSH配置 1.1. 使用SSH服务更加安全 [root@centos7 ~]# vi /etc/ssh/sshd_config 设置如下 PermitRootLo ...
- css文字飞入效果
一.页面的主体布局 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> & ...
- text-overflow修剪文本,以省略号显示
overflow: hidden; 必须设置,不然无法修剪文本 white-space: nowrap; 规定段落中的文本不进行换行 text-overflow: ellipsis; 当文本溢出 ...
- web.xml里welcome-file欢迎页面配置及web.xml简介
web项目欢迎页面的配置 <welcome-file-list> <welcome-file>/WEB-INF/index.html</welcome-file> ...
- CSS深入理解之overflow(HTML/CSS)
简介 overflow看上去其貌不扬,其中蕴含的知识点还是很多的,有很多鲜为人知的特性表现. overflow基本属性值 1.visible(默认) 2.hidden 3.scroll 4.auto ...
- ubuntu-15.04-desktop-amd64想要安装KDE桌面,结果出现如下问题
The following packages have unmet dependencies: kubuntu-desktop : Depends: ark but it is not going t ...
- C/C++内存分区
C/C++编译的程序占用的内存分区 1.栈区(stack)— 由编译器自动分配释放 ,存放函数的参数名,局部变量的名等.其操作方式类似于数据结构中的栈. 2.堆区(heap)— 由程序员分配释放, 若 ...
- 搭建企业级NFS网络文件共享服务说明[一]
1.1.0. 概述: 共享/NFS目录给整个192.168.25.0/24网段主机读写 man nfs 可以查看mount的信息 rpc端口111 nfs主端口2049 1.1.1. 搭建NFS环境 ...
- 禁用休眠(删除休眠文件) 关掉此选项可节省C盘好几G空间:文章内容bat文件源码
@ECHO offTITLE 关掉休眠 MACHENIKE set TempFile_Name=%SystemRoot%\System32\BatTestUACin_SysRt%Random%.bat ...
- 详解权限管理(RBAC)的实现方法
在说权限管理前,应该先知道权限管理要有哪些功能: ().用户只能访问,指定的控制器,指定的方法 ().用户可以存在于多个用户组里 ().用户组可以选择,指定的控制器,指定的方法 ().可以添加控制器和 ...