Vue, resource use basic
url are ineffective, can only use their own, and on the post so that, have to open local services
. 1 <! DOCTYPE HTML > 2 < HTML > . 3 < head > . 4 < Meta charset = "UTF-. 8" > . 5 < Script the src = "../ JS / vue.js" > </ Script > . 6 < Script the src = "../js/vue-resource-1.3.4.js" > </ Script > 7 <-! mount up this $ http, can come out many ways.. -> 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 is < Script > . 19 var VM = new new Vue ({ 20 is EL: ' #app ' , 21 is Data: {}, 22 is Methods: { 23 is getInfo () { 24 // When the get request initiated by then set successful callback function 25 the this $ http.get. ( ' HTTP: // localhost: 8080 / jiangbx / zdDept / list.do ' ) .then ( function (Result) { 26 is // server get back through result.body successful data 27 // console.log (result.body) 28 }) 29 }, 30 postinfo () { // initiate post request file application / X-form-urlencoded of wwww- 31 is // post request initiated manually, no form default format, so that the server can not handle some 32 // by the third parameter post method, {emulateJSON: true} filed content type form common data format 33 is the this $ http.post (. ' HTTP: // localhost: 8080 / jiangbx / zdDept / list.do ' , { }, {}). the then (Result => { 34 is the console.log (result.body) 35 }) 36 }, 37 [ jsonpInfo () { 38 is the this.$http.jsonp('http://localhost:8080//jiangbx/zdDept/list.do').then(result => { 39 console.log(result.body) 40 }) 41 } 42 } 43 }); 44 </script>