vue-resource

问题描述: 使用vue-resource进行get请求,然后就出现跨域访问的问题,由于后台使用springBoot进行创建的,添加下面一个类解决了跨域问题 解决办法 import org.springframework.context.annotation.Configuration; import org.springframework.web.servlet.config.annotation.CorsRegistry; import org.springframework.web.servlet.config.annotation.WebMvcConfigurer; @Configuration public class CorsConfig implements WebMvcConfigurer { @Override public void addCorsMappings(CorsRegistry registry) { registry.addMapping("/**") .allowedOrigins("*") .allowedMethods("GET", "HEAD", "POST", "PUT", "DELETE", "OPTIONS") .allowCredentials(true) .maxAge(3600) .allowedHeaders("*"); } }

GitHub Source 本文的所有示例如下： http get示例 http jsonp示例 http post示例 http put示例 http delete示例 resource get示例 resource save示例(HTTP POST) resource update示例(HTTP PUT) resource remove示例(HTTP DELETE) inteceptor示例1——ajax请求的loading界面 inteceptor实例2——请求失败时的提示对话框 各位在阅读这篇文章的内容时，可以先尝试该列表的最后两个示例，这两个示例综合使用了this.$http和inteceptor。 vue-resource特点 vue-resource插件具有以下特点： 1. 体积小 vue-resource非常小巧，在压缩以后只有大约12KB，服务端启用gzip压缩后只有4.5KB大小，这远比 jQuery 的体积要小得多。 2. 支持主流的浏览器 和Vue.js一样，vue-resource除了不支持IE 9以下的浏览器，其他主流的浏览器都支持。 3. 支持 Promise API和 URI Templates Promise是ES6的特性，Promise的中文含义为“先知”，Promise对象用于异步计算。 URI Templates表示URI模板

vue_resource和axios 1. 简介 vue本身不支持发送AJAX请求，需要使用vue-resource、axios等插件实现 axios是一个基于Promise的HTTP请求客户端，用来发送请求，也是vue2.0官方推荐的，同时不再对vue-resource进行更新和维护 参考：GitHub上搜索axios，查看API文档 2. 使用axios发送AJAX请求 2.1 安装axios并引入 npm install axios -S 也可直接下载axios.min.js文件 2.2 基本用法 axios([options]) axios.get(url[,options]); 传参方式： 1.通过url传参 2.通过params选项传参 axios.post(url,data,[options]); axios默认发送数据时，数据格式是Request Payload，并非我们常用的Form Data格式， 所以参数必须要以键值对形式传递，不能以json形式传参 传参方式： 1.自己拼接为键值对 2.使用transformRequest，在请求发送前将请求数据进行转换 3.如果使用模块化开发，可以使用qs模块进行转换 axios本身并不支持发送跨域的请求，没有提供相应的API，作者也暂没计划在axios添加支持发送跨域请求，所以只能使用第三方库 3. 使用vue

概述 上一篇我们介绍了如何将$.ajax和Vue.js结合在一起使用，并实现了一个简单的跨域CURD示例。Vue.js是数据驱动的，这使得我们并不需要直接操作DOM，如果我们不需要使用jQuery的DOM选择器，就没有必要引入jQuery。vue-resource是Vue.js的一款插件，它可以通过XMLHttpRequest或JSONP发起请求并处理响应。也就是说，$.ajax能做的事情，vue-resource插件一样也能做到，而且vue-resource的API更为简洁。另外，vue-resource还提供了非常有用的inteceptor功能，使用inteceptor可以在请求前和请求后附加一些行为，比如使用inteceptor在ajax请求时显示loading界面。 本文的主要内容如下： 介绍vue-resource的特点 介绍vue-resource的基本使用方法 基于this.$http的增删查改示例 基于this.$resource的增删查改示例 基于inteceptor实现请求等待时的loading画面 基于inteceptor实现请求错误时的提示画面 本文11个示例的源码已放到GitHub，如果您觉得本篇内容不错，请点个赞，或在GitHub上加个星星！ GitHub Source 本文的所有示例如下： http get示例 http jsonp示例 http

1、vue实例的生命周期 　　 　　 　　 　　 2、vue-resource---是一个第3方包（和vue配套使用的第3方包，因为在vue中不提倡使用jquery） 　　 　　 　　 　　　　其中options，和errorCallback都是可选参数，非必传 　　　　 　　　　 　　　 　　　　 　　　　 　　　　改造：配置全局的根路径，全局配置post请求表单提交要配置的参数 　　　　 　　　　 　　　　 　　　　 3、axios 　　　　 　　　　get post请求写法和vue-resource一样 　　　　 　　　　 　　　　 　　　　　 　　　　在vue中的使用: 　　　　 　　　　 　　　　 来源： https://www.cnblogs.com/yangyutian/p/11045672.html