vue.js的ajax和jsonp请求

引入vue.js

引入vue插件

html代码
{{txt}}
js代码
//全局使用(已get请求为例)
Vue.http.get(url, [options]).then(successCallback, errorCallback);

//在Vue实例类使用
this.$http.get(url, [options]).then(successCallback, errorCallback);

var test = new  Vue({
  el:'#v',
  data:{
    jsonUrl:'xxxx',
    jsonpUrl:'xxxxx',
    req:{}
    resData:[]
  },
  mthods:{
    init:function(id){
      this.$http.get(this.jsonUrl,this.req).then(function(res){
        console.log(res);
        this.$set('resData',res);
      },function(res){
        console.warn(res);
      })
    },
    cli:function(id){
      //jsonp请求
      this.$http.jsonp(this.jsonpUrl).then(
        function(res){
          console.log(res);
          this.$set('resData',res);
        }
      )
    }
  }
})


 
  

//需要注意的是jsonp请求的服务端返回的数据格式有些不一样,下面以php为例

$call = $_GET['callback'];
$json = json_encode(['data'=>'tttttt']);
echo $call.'('.$json.')';



你可能感兴趣的:(js)