Vue 请求数据插件
引入vue-resource
安装命令
npm install vue-resource --save --save 是将这个包括到package中
在vue中import
Import VueResource from ‘vue-resource’
Var api=’’;
this.$http.get(api).then((response)=>{
console.log(response);
//注意this指向
this.list=response.body.result;
},function(err){
console.log(err);
})
或者
this.$http.get(api).then(function(response){
console.log(response);
//注意this指向
this.list=response.body.result;
},function(err){
console.log(err);
})
requestData(){
//jsonp请求的话 后台api接口要支持jsonp
var api='http://www.phonegap100.com/appapi.php?a=getPortalList&catid=20&page=1';
this.$http.jsonp(api).then((response)=>{
if (response.data.success)if (reif (response.data.success) {sif (response.data.success) {ponse.data.success) { {
if (response.data.succif (response.data.success) {ess) {
console.log(response);
//注意：用到this要注意this指向
this.list=response.body.result;
},function(err){
console.log(err);
})
/*使用vue-resource请求数据的步骤
1、需要安装vue-resource模块， 注意加上 --save
npm install vue-resource --save / cnpm install vue-resource --save
2、main.js引入 vue-resource
import VueResource from 'vue-resource';
3、main.js Vue.use(VueResource);
4、在组件里面直接使用
this.$http.get(地址).then(function(){
})
*/
Axios
/*
请求数据的模板
axios 的使用
1、安装 cnpm install axios --save
2、哪里用哪里引入axios
import Axios from 'axios';
import axios from 'axios'
Vue.prototype.$http = axios
import axios from 'axios'
Vue.prototype.$http = axios
这样做的好处是在vue实例或组件中不用再去重复引用Axios 直接用this.$axios就能执行axios 方法
var api='http://www.phonegap100.com/appapi.php?a=getPortalList&catid=20&page=1';
Axios.get(api).then((response)=>{
this.list=response.data.result;
}).catch((error)=>{
console.log(error);
})
Example
执行 GET 请求
// 为给定 ID 的 user 创建请求
axios.get('/user?ID=12345')
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
// 可选地，上面的请求可以这样做
axios.get('/user', {
params: {
ID: 12345
}
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
执行 POST 请求
axios.post('/user', {
firstName: 'Fred',
lastName: 'Flintstone'
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
})