Vue2.x axios发送post请求
安装axios
$ npm install axios
//使用淘宝源
$ cnpm install axios
//或者使用cdn:一般不使用
script src=“https://unpkg.com/axios/dist/axios.min.js”
配置main.js
以下代码为之前开发的项目中的配置代码 可供参考
// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import App from './App'
import router from './router'
import Axios from 'axios'
import ElementUI from 'element-ui'
Axios.defaults.headers.post['Content-Type']='application/json'
Vue.config.productionTip = false
Vue.prototype.$axios=Axios
//请求拦截器
Axios.interceptors.request.use(function(config){
// if(config.method=='post'){
// config.data=qs.stringify(config.data)
// }
return config;
},function(error){
return Promise.reject(error);
});
//响应拦截器
Axios.interceptors.response.use(function(response){
return response;
},function(error){
return Promise.reject(error);
});
/* eslint-disable no-new */
new Vue({
el: '#app',
router,
components: { App },
template: '<App/>'
})
router.afterEach((to,from,next) => {
window.scrollTo(0,0);
})
vue文件内 script代码
export default {
name: 'XXXXXXXXX',
data() {
return {
params: {
"columns": ["name", "agent", "estimateTime", "actualTime", "timeoutLength"],
"filter": { //过滤条件
"timeoutAlarmType": {
"eq": "enterTimeout"
},
"createTime": {
"gt": "2018/11/21/00:00:00",
"le": "2018/11/22/00:00:00"
}
},
"table": "AlarmRecord"
},
}
},
components: {
},
created() {
this.$axios.post("http://000.000.000.000:000/app/query", (this.params))
.then(res => {
this.company = res.data.data;//company可替换任意XX
this.dealList = this.company;//为了分页
console.log(res);
})
.catch(error => {
console.log(error)
});
},
}