Vue,resource基本使用
url都失效了, 只能用自己的了, 就post好使, 得开本地的服务
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <script src="../js/vue.js"></script> 6 <script src="../js/vue-resource-1.3.4.js"></script> 7 <!-- 挂载了 this.$http, 可以.出来很多方法 --> 8 <title></title> 9 </head> 10 <body> 11 <div id="app"> 12 <input type="button" value="get请求" @click="getInfo" /> 13 <input type="button" value="post请求" @click="postInfo" /> 14 <input type="button" value="josnp请求" @click="jsonpInfo" /> 15 </div> 16 </body> 17 </html> 18 <script> 19 var vm = new Vue({ 20 el:'#app', 21 data:{}, 22 methods:{ 23 getInfo(){ 24 // 当发起get请求之后, 通过 then 来设置成功的回调函数 25 this.$http.get('http://localhost:8080/jiangbx/zdDept/list.do').then(function(result){ 26 // 通过 result.body 拿到服务器返回的成功的数据 27 // console.log(result.body) 28 }) 29 }, 30 postInfo(){ // 发起 post 请求 application/x-wwww-form-urlencoded 31 // 手动发起的 post 请求, 默认没有表单格式, 所以, 有的服务器处理不了 32 // 通过 post 方法的第三个参数, { emulateJSON: true } 设置 提交的内容类型 为 普通表单数据格式 33 this.$http.post('http://localhost:8080/jiangbx/zdDept/list.do',{},{}).then(result=>{ 34 console.log(result.body) 35 }) 36 }, 37 jsonpInfo(){ 38 this.$http.jsonp('http://localhost:8080//jiangbx/zdDept/list.do').then(result => { 39 console.log(result.body) 40 }) 41 } 42 } 43 }); 44 </script>