VUE-リソース - AJAXリクエストデータ

<！DOCTYPE HTML > 
< HTML LANG = "EN" > 

< 頭> 
  < メタ文字コード= "UTF-8" > 
  < メタ名= "ビューポート" コンテンツ= "幅=装置幅、初期の規模= 1.0" > 
  < メタHTTP -equiv = "X-UA-互換性のある" コンテンツ= "IE =エッジ" > 
  < タイトル>ドキュメント</ タイトル> 
  < スクリプトSRC = "./ libに/ VUE-2.4.0.js" > <
  注：順序は留意する必要があるので、Vueの上VUEリソース依存   - > 
  <！ - このhttp.jsonp $。- > 
  < スクリプトSRC = "./ libに/ VUE資源-1.3.4.js" > </ スクリプト> 
</ ヘッド> 

< 身体> 
  < DIV ID = "アプリケーション" > 
    < INPUTのタイプ= "ボタン" 値= "GETリクエスト" @click = "GETINFO" > 
    < INPUTのタイプ= "ボタン" 値=「POST要求" @click =" postinfo " >
    < 入力タイプ=「ボタン」値= "要求JSONP" @click = "jsonpInfo" > 
  </ divの> 

  < スクリプト> 
    // 与えることを、Vueのインスタンスを作成しますViewModelに
    VAR VM =  新しい新しいヴュー（{ 
      EL：' #app ' 、
      データ：{}、
      メソッド：{ 
        GETINFO（）{ // リクエストを取得開始
          //   成功コールバック関数を設定するために、開始を取得要求の後.then 
          これ。http.get $（「http://vue.studyit.io/api/getlunbo 」）。その後、（機能（結果）{
             //console.log（結果）//ステータス、ヘッダを含む全データを取得
            // result.bodyによっては、成功したデータは、サーバによって返され得る
            // はconsole.log（result.body）
          }）
        }、
        postinfo（）{ // POSTリクエストがファイルアプリケーション/ wwww-のX-form-urlencodedで開始
          //   手動サーバーは、いくつかの処理できないように、POSTリクエストフォームは、デフォルトフォーマットではない開始
          //   第3のパラメータPOSTメソッド、{：真emulateJSONを}コンテンツタイプは、形成共通のデータ形式を提出し
          、これを。http.post $（' http://vue.studyit.io/api/post ' ：{}、{emulateJSON 真へ、次いで（結果。}）=> { 
            コンソール.logの（result.body）
          }）
        }、
        jsonpInfo（）{ //发起JSONP请求
          この。$ http.jsonp（' http://vue.studyit.io/api/jsonp ' ）.then（結果=> { 
            にconsole.log（result.body）
          }）
        } 
      } 
    }）。
  </ スクリプト> 
</ ボディ> 

</ HTML >
VUE-リソース - AJAXリクエストデータ

おすすめ
