Promise封装axios(封装的方法网上很多，不详细写了) 可参考： https://www.kancloud.cn/cooldrw2015/vue_2/1163405 https://www.jianshu.com/p/0229211ea679
/** * post方法，对应post请求 * @param {String} url [请求的url地址] * @param {Object} params [请求时携带的参数] */ export function post(url, params) { return new Promise((resolve, reject) => { axios.post(url, QS.stringify(params)) .then(res => { resolve(res.data); }) .catch(err =>{ reject(err.data) }) }); }我的实现步骤： 1.创建一个axios.js，以POST为例，在axios.js中统一请求路径：
export const postRequest = (url, params) => { return new Promise((resolve ,reject)=>{ let res= axios({ method: 'post', url: `${base}${url}`, data: JSON.stringify(params), dataType : "json", headers: { 'Content-Type': 'application/json' } }); resolve(res); //返回值 }); };2.创建api.js存放后台请求路径
// 引入axios.js import { postRequest} from ' axios.js文件路径 '; //后台接口 export const getInfo = (params) => { return postRequest('/test/getInfo ',params) } export const getData = (params) => { return postRequest('/test/getData ',params) }3.创建test.vue
<style> </style> <template></template> <script> //引入api.js import { //需要调用的方法名称，同api.js中的方法名称 getInfo, getData }from ' api.js的文件路径 '; export default { name:"test", data(){ return { info:"", data:"" } }, methods:{ getInfo:function (params) { return getInfo(params); //定义方法时，直接return getInfo (params) }, getData:function (params) { return getData(params); } }, //begin======【只能在这个区域内同步】================================= async created(){ //一定要用async和await let info=await this.getInfo(123); let data=await this. getData(info); //先执行getInfo方法，返回info的值后，再执行getData方法 }， //end============================================================= 我是别的方法(){ //this.info的值仍然为“” } } </script>注意：async和await同步的地方依据个人需求而定；也可以在methods中定义方法时写。 以上步骤是亲自采坑后总结的，希望能帮助到跟我有同样遭遇的序员们@_@
