vue2.0—请求
2018-09-27 本文已影响16人
杀个程序猿祭天
vue2.0—请求
构建项目和创建组件就不细说了,不懂的可以去官方文档API学习
VUE官方文档:https://cn.vuejs.org/v2/guide/
1.下载axios并在main.js中全局引入
使用说明 · Axios 中文说明 · 看云
$ cnpm install axios -S
//main.js 全局引入
import Vue from 'vue'
import App from './App'
import router from './router'
import axios from 'axios'
//放到Vue原型上面
Vue.prototype.$http = axios;
Vue.config.productionTip = false
new Vue({
el: '#app',
router,
components: { App },
template: '<App/>'
})
//*******或者局部引入
//home.vue
import axios from "axios"
2.在组件中使用
<script>
this.$http.get(url).then(resp=>{
//成功处理
}).catch({
//失败处理
})
</script >
3.跨域请求使用vue-resource
Vue.js——vue-resource全攻略 - ___chen - 博客园
//下载vue-resource
cnpm install vue-resource -S
//在main.js中引入
import VueResource from 'vue-resource'
Vue.use(VueResource);
<script>
//使用
this.$http.jsonp('https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su',{
params:{
wd:'a'
},
jsonp:'cb'
}).then(resp=>{
console.log(resp.body.s);
}).catch(err=>{
console.log(err)
})
</script >