Vue vue-resource request data mode three kinds of pet, post, jsonp

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <script src="./lib/vue-2.4.0.js"></script>
  <!--Note: vue-resource dependent on Vue, so the order is to be noted   -> 
  <-! The this http.jsonp $. -> 
  < Script the src = "./ lib / VUE-Resource-1.3.4.js" > </ Script > 
</ head > 

< body > 
  < div ID = "App" > 
    < INPUT type = "Button" value = "GET request" @click = "getInfo" > 
    < INPUT type = "Button" value = "POST request " @click =" postinfo " >
    <input type="button"value = "Request JSONP" @click = "jsonpInfo" > 
  </ div > 

  < Script > 
    // Create Vue instance, to give the ViewModel 
    var VM =  new new Vue ({ 
      EL: ' #app ' , 
      Data: {}, 
      Methods: { 
        getInfo () { 
          // initiate get request 
          //   after initiation get request, to set a successful callback function .then 
          the this . http.get $ ( ' http://jsonplaceholder.typicode.com/users ' ) .then ( Result => {
             // successful data returned by the server to get through result.body
            the console.log ( ' This is the data of the get request: ' ) 
            the console.log (result.body) 
          }) 
        }, 

        postinfo () { 
          // initiate post request http://jsonplaceholder.typicode.com/users 
          //   manually initiated Post request the default format not form, so the server can not handle some 
          //   third parameter post method, {emulateJSON: true} content type filed common data format form 
          the this . http.post $ ( ' http://jsonplaceholder.typicode.com/users ' , {}, {emulateJSON: to true }.) the then (Result => { 
            the console.log ( ' this is the post data request: ' )
            the console.log (result.body)
          }) 
        }, 

        JsonpInfo () { // initiate JSONP request 
          the this . Http.jsonp $ ( ' http://jsonplaceholder.typicode.com/users ' ) .then (Result => { 
            the console.log ( ' the request is JSONP data: ' ) 
            the console.log (result.body) 
          }) 
        } 
      } 
    }); 
  </ Script > 
</ body > 

</ HTML >
The data returned:
Vue vue-resource request data mode three kinds of pet, post, jsonp

Guess you like
