vuejs前端框架做者推荐使用axios进行数据请求,axios的使用方法很是简单,最近在使用vuejs碰到个小问题,因而记录一下:
1.若是是npm管理前端项目的话,直接npm i axios --save-dev安装就好,若是不是,那么直接引用就好了
使用的时候在页面的script中import axios from 'axios'引入,下面是es6的函数式写法前端
getList: function (page, limit) { axios.get('/api/v1/topics', { params: { page: this.page || 1, tab: this.tab, limit: this.limit || 20 } }).then((response) => {//这里使用箭头函数,那么下面的this指向就没有问题了 const data = response.data if (data) { this.list = data } }).catch((error) => { console.log(error) }) }
2.axios不支持jsonp,由于axios的做者以为jsonp不太友好,推荐用CORS方式更为干净,可是jsonp支持范围更加广阔一些,一些老式的IE浏览器也能支持,因此有些公司仍是jsonp用的多些,那么若是要使用jsonp,能够独立安装
npm i jsonp --save-dev 而后在页面中引用import jsonp from 'jsonp',使用方式也是很是简单的:vue
getList: function () { jsonp(config.ajaxUrl + '路径', null, (err, data) => { if (err) { console.error(err.message); } else { if (data.list.length > 0) { data.list.map((item) => this.list.push(item)) console.log(data); } } }) }