vue------axios在vue中的基本使用（方法調用）（未封裝的原始axios）

vue項目的創建

vue請求方法彙總（調用方式）

get請求

created() {
	//說明：
	// <methods> : get、post、put、delete、patch
	// 參數1爲params:{name:xxx,age:12}時，表示將參數放在url上，不分什麼方法
	// 參數1爲data:{name:xxx,age:12}時，表示不再url上傳遞參數，放在了body中
	// 參數2的字段爲params時，表示將參數放在url上傳遞
	// 參數2的字段爲data時，表示將參數放在body上傳遞
	// axios.<methods>(url,{參數1}).then(res=>{})
	// axios({urld:'url',methods:"<methods>",參數2:'要發送的數據對象'}).then(res=>{})
	
	// 舉例 http://www.baidu.com  參數爲let obj = {id:1,position:'東京'}
	
	// 第一種方式axios.get()
	
	// params時: http://www.baidu.com?id=1&position=東京
	 axios
      .get("./data.json", {
        params: {
          id: 2,
          name: "小明"
        }
      })
      .then(res => {
        console.log(res);
      });
      
      // data時: http://www.baidu.com 
      // 參數不再url上： {id:1,position:'東京'}
       axios
      .get("./data.json", {
        data: {
          id: 2,
          name: "小明"
        }
      })
      .then(res => {
        console.log(res);
      });
      
	// 第二種方式axios({})
	
	// params時: http://www.baidu.com?id=1&position=東京
	axios({
      url: "./data.json",
      methods: "GET",
      params: { id: 12, name: 1 }
    }).then(res => {
      console.log(res);
    });
    
    // data時: http://www.baidu.com 
    // 參數不再url上： {id:1,position:'東京'}
    axios({
      url: "./data.json",
      methods: "GET",
      data: { id: 12, name: 1 }
    }).then(res => {
      console.log(res);
    });
}

總結: 不論你是採用axios.方法名(url,{params<或data>：{}})還是axios({url,methods,params<或data>})
都要記住一點，溝通好參數發送的方式

1. 要放在url上，傳參字段用params,採用axios.方法名(url,{params：{}})或axios({url,methods,params：{}})
2. 要放在body中傳遞：傳參字段用data,採用axios.方法名(url,{data：{}})或axios({url,methods,data：{}})

axios併發請求方式

就是同時進行多個請求，並統一處理返回值！

1. 多個請求的先後順序就是書寫的順序
2. 用到的方法：axios.all() axios.spread() 連用

 axios.all([axios.get("./data.json"), axios.get("/get")]).then(
      axios.spread((data, get) => {
        console.log(data, get);
      })
    );