- vue-cli3.0以後,創建的服務器的配置文件被隱藏了,需要對服務器進行配置的話,必須在項目根目錄下手動添加一個vue.config.js文件進行配置,vue在啓動項目的時候,會把這個配置項整合到項目中。
- 對於前後端分離的項目,前端需要使用ajax請求從服務器請求數據,所以就必須對vue項目提供的http服務器設置代理,將ajax請求代理目標服務器。
安裝
npm install axios
導入
main.js
將axios添加到vue構造函數的原型上,這樣所有的組件都可以訪問原型中的axios
import axios from "axios";
Vue.prototype.http = axios;
axios對象的 get請求
// axios對象的.get方法,用於發起一個get請求,第一個參數是請求地址,第二個參數是本次請求的配置對象,其中params選項是get請求的參數。
// get方法返回一個promise,所以可以使用.then .catch
axios.get("/api/get",{
params:{
name:"笑笑",
age:13
}
})
.then(res=>{
// 請求成功的回調函數中參數不是響應數據,而是整個響應報文,其中data纔是響應數據。
console.log(res.data);
this.msg = res.data.msg
})
.catch(function(err){
console.log(err);
});
axios對象的post請求
let data = {name:"sun",age:30};
// data = this.urlcode.encode(data);
// axios發起post請求,第二個參數可以是urlencode格式的字符串,這樣發起的請求數據格式是urlencode格式,也可以是一個對象,這樣發起的請求數據格式是JSON。
this.http.post("/api/post",data)
.then(res=>{
this.postMsg = res.data.msg;
})
待續…