作者QQ:1095737364    QQ群:123300273     欢迎加入!
 

要引入模块: vue-resource

1.在package.json中的dependencies中添加vue-resource模块,然后安装(运行npm instal)

"dependencies": {
  "vue": "^2.3.3",
  "vue-router": "^2.6.0",
  "vue-resource":"^1.2.1"
},

2.在router路由文件夹的index 下添加如下代码:

import VueResource from 'vue-resource'
Vue.use(VueResource)

3.要使用请求的地方使用如下代码模板:

this.$http.get('/http://localhost:8080/graphicOneData').then(response => {
  console.log(response);
  var datas = JSON.parse(response.bodyText);
}, response => {
  console.log("error");
});
注意:
1.在请求接口数据时,涉及到跨域请求出现下面错误: 
           XMLHttpRequest cannot load http://localhost:8088/test. No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://localhost:8080’ is therefore not allowed access.
解决办法:
在接口中设置:
response.setHeader("Access-Control-Allow-Origin", "*");
response.setCharacterEncoding("UTF-8");
request.setCharacterEncoding("UTF-8");
response.setHeader("Access-Control-Allow-Origin", "*");
response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");
response.setHeader("Access-Control-Max-Age", "3600");
response.setHeader("Access-Control-Allow-Headers", "x-requested-with,Authorization");
response.setHeader("Access-Control-Allow-Credentials","true");
 

vue 数据请求的更多相关文章

  1. VUE 数据请求和响应(axios)

    1. 概述 1.1 简介 axios是一个基于Promise(本机支持ES6 Promise实现) 的HTTP库,用于浏览器和 nodejs 的 HTTP 客户端.具有以下特征: 从浏览器中创建 XM ...

  2. vue数据请求显示loading图

    一般项目中,有时候会要求,你在数据请求的时候显示一张gif图片,然后数据加载完后,消失.这个,一般只需要在封装的axios中写入js事件即可.当然,我们首先需要在app.vue中,加入此图片.如下: ...

  3. vue数据请求

    我是vue菜鸟,第一次用vue做项目,写一些自己的理解,可能有些不正确,欢迎纠正. vue开发环境要配置本地代理服务.把config文件加下的index.js里的dev添加一些内容, dev: { e ...

  4. vue axios数据请求get、post方法的使用

    我们常用的有get方法以及post方法,下面简单的介绍一下这两种请求方法 vue中使用axios方法我们先安装axios这个方法 npm install --save axios 安装之后采用按需引入 ...

  5. VUE开发请求本地数据的配置,旧版本dev-server.js,新版本webpack.dev.conf.js

    VUE开发请求本地数据的配置,早期的vue-lic下面有dev-server.js和dev-client.js两文件,请求本地数据在dev-server.js里配置,最新的vue-webpack-te ...

  6. 02 Vue之vue对象属性功能&axios数据请求实现

    1.过滤器的声明和使用 过滤器,就是vue允许开发者自定义的文本格式化函数,可以使用在两个地方:输出内容和操作数据中. 定义过滤器的方式有两种. 1 使用Vue.filter()进行全局定义 2 在v ...

  7. day 74 vue 2 axios数据请求 以及组件的学习

    前情提要:   vue 学习二: 一: 通过axios实现数据请求 1:json数据语法 json数据对象类似于JavaScript中的对象,但是它的键对应的值里面是没有函数方法的,值可以是普通变量, ...

  8. 手把手教你vue配置请求本地json数据

    本篇文章主要介绍了vue配置请求本地json数据的方法,分享给大家,具体如下:在build文件夹下找到webpack.dev.conf.js文件,在const portfinder = require ...

  9. vue开发请求本地模拟数据的配置方法(转)

    VUE开发请求本地数据的配置,早期的vue-lic下面有dev-server.js和dev-client.js两文件,请求本地数据在dev-server.js里配置,最新的vue-webpack-te ...

随机推荐

  1. 修改git全局初始化的用户名

    今天我把文件上传到码云的时候出现 翻译的话就是 用户名不能多个值 这样的错误     所以想要解决这个错误的话非常简单 $ git config --global --replace-all user ...

  2. 利用django-simple-captcha生成验证码

    参考文档 http://django-simple-captcha.readthedocs.io/en/latest/ django支持1.7+ 1.安装 pip install django-sim ...

  3. js变量提升

    JavaScript的函数定义有个特点,它会先扫描整个函数体的语句,把所有申明的变量“提升”到函数顶部: 'use strict'; function foo() { var x = 'Hello, ...

  4. Docker 镜像安装 GitLab 中文社区版

    docker run \ --detach \ --publish : \ --publish : \ --name gitlab \ --restart unless-stopped \ --vol ...

  5. C#集成FastDFS断点续传

    C#集成FastDFS断点续传 参考 .net版本FastDFS客户端v5.05. https://github.com/zhouyh362329/fastdfs.client.net FastDFS ...

  6. ASP.NET状态管理的总结

    阅读目录 开始 hidden-input QueryString Cookie ApplicationState ViewState,ControlState Session Profile 各种状态 ...

  7. Android中Serializable和Parcelable序列化对象详解

    学习内容: 1.序列化的目的 2.Android中序列化的两种方式 3.Parcelable与Serializable的性能比较 4.Android中如何使用Parcelable进行序列化操作 5.P ...

  8. win2003 远程连接限制

    1.单击开始->运行,输入gpedit.msc,打开组策略编辑器,找到计算机配置 ->管理模版 -> Windows组件 ->终端服务.把限制连接数量的属性修改成我们需要的数字 ...

  9. php -- 日期时间

    ----- 017-datetime.php ----- <!DOCTYPE html> <html> <head> <meta http-equiv=&qu ...

  10. 大整数相加 a+b 的c语言实现

    终于来到我所期盼的高精度整数相加的题目了.这个题很经典,也算是一个很好的算法入门题吧. 如果是java的话,系统类库已经内置了BigInteger类,直接调用就可以很轻易地解决了.但是学习c的编写也是 ...