vue.js中使用Axios

Posted 2020-09-30

Axios为vue2.0官方推荐HTTP请求工具，之前的是vue-resource

在使用的过程中总结了两种使用方式：

　　1.和vue-resource使用类似

　　　　引入：import axios from ‘axios‘;

　　　　　　　Vue.prototype.$http = axios;

　　　　使用：this.$http.get(URL).then(response => { // success callback }, response => { // error callback });

　　2.在你需要的组件中使用

　　　　引入：import axios from ‘axios‘;

　　　　使用：axios.get(URL).then(response => { // success callback }, response => { // error callback });

注：在将response返回值赋值给data是一直不成功，之前的代码：

　　　　axios.get()
　　　　.then(function (response) {
　　　　　　if (response.data.errno === ERR_OK) {
　　　　　　　　this.seller = response.data.data;
　　　　　　}
　　　　　　console.log(response.data.data);
　　　　})
　　　　.catch(function (error) {
　　　　　　console.log(error);
　　　　});

　　现在改为es6语法规范就好了，现在的代码：

　　　　axios.get(‘/api/seller‘).then(response => {
　　　　　　if (response.data.errno === ERR_OK) {
　　　　　　　　this.seller = response.data.data;
　　　　　　}
　　　　}, response => {
　　　　　　console.log(response);
　　　　});