002 vue-resource
Posted juncaoit
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了002 vue-resource相关的知识,希望对你有一定的参考价值。
一:概述
1.说明
https://github.com/pagekit/vue-resource
2.使用方法
Vue.http.get(‘/someUrl‘, [config]).then(successCallback, errorCallback);
Vue.http.post(‘/someUrl‘, [body], [config]).then(successCallback, errorCallback);
// in a Vue instance
this.$http.get(‘/someUrl‘, [config]).then(successCallback, errorCallback);
this.$http.post(‘/someUrl‘, [body], [config]).then(successCallback, errorCallback);
二:示例
1.添加包
1 <!DOCTYPE html> 2 <html lang="en"> 3 4 <head> 5 <meta charset="UTF-8"> 6 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 7 <meta http-equiv="X-UA-Compatible" content="ie=edge"> 8 <title>Document</title> 9 <script src="./lib/vue-2.4.0.js"></script> 10 <!-- 注意:vue-resource 依赖于 Vue,所以先后顺序要注意 --> 11 <!-- this.$http.jsonp --> 12 <script src="./lib/vue-resource-1.3.4.js"></script> 13 </head> 14 15 <body> 16 <div id="app"> 17 <input type="button" value="get请求" @click="getInfo"> 18 <input type="button" value="post请求" @click="postInfo"> 19 <input type="button" value="jsonp请求" @click="jsonpInfo"> 20 </div> 21 22 <script> 23 24 // 创建 Vue 实例,得到 ViewModel 25 var vm = new Vue( 26 port: 8082, 27 el: ‘#app‘, 28 data: , 29 methods: 30 getInfo() // 发起get请求 31 // 当发起get请求之后, 通过 .then 来设置成功的回调函数 32 this.$http.get(‘http://localhost:8090/hello‘).then(function (result) 33 // 通过 result.body 拿到服务器返回的成功的数据 34 console.log(result.body) 35 ) 36 , 37 postInfo() // 发起 post 请求 application/x-wwww-form-urlencoded 38 // 手动发起的 Post 请求,默认没有表单格式,所以,有的服务器处理不了 39 // 通过 post 方法的第三个参数, emulateJSON: true 设置 提交的内容类型 为 普通表单数据格式 40 this.$http.post(‘http://vue.studyit.io/api/post‘, , emulateJSON: true ).then(result => 41 console.log(result.body) 42 ) 43 , 44 jsonpInfo() // 发起JSONP 请求 45 this.$http.jsonp(‘http://localhost:8090/hello‘).then(function(result) 46 console.log(result) 47 console.log(result.body) 48 ) 49 50 51 ); 52 </script> 53 </body> 54 55 </html>
以上是关于002 vue-resource的主要内容,如果未能解决你的问题,请参考以下文章
AtCoder Grand Contest 002 (AGC002) F - Leftmost Ball 动态规划 排列组合