vue axios資料請求get、post方法的使用

旭i丿發表於2018-09-11
VueiOS

我們常用的有get方法以及post方法，下面簡單的介紹一下這兩種請求方法

vue中使用axios方法我們先安裝axios這個方法

npm install –save axios

安裝之後採用按需引入的方法，哪個頁面需要請求資料就在哪個頁面裡引入一下。

import axios from `axios`

引入之後我們就可以進行資料請求了，在methods中建立一個方法

1 methods：{
2     getInfo（）{
3         let url = "url"
4         axios.get(url).then((res)=>{
5             console.log(res)
6         })      
7     }  
8 }

然後我們在mounted這個生命週期中進行呼叫

1 mounted（）{
2     this.getInfo()  
3 }

這樣就可以在控制檯中檢視資料，以上是一個簡單的get方法資料請求，下面繼續介紹一下post方法的使用，其實post和get的使用沒有什麼區別只是再加上一個引數就可以了，看一下我們的程式碼

 1 methods：{
 2     postInfo（）{
 3         let url = "url"
 4         let params=new URLSearchParams();//這個方法在axios的官網中有介紹，除了這個方法還有qs這個方法
 5         params.append("key",index) 
 6         params.append("key",index)
 7         axios.post(url,params).then((res)=>{
 8             console.log(res)
 9         })
10     }    
11 }

同樣在mounted這個生命週期中進行呼叫

1 mounted（）{
2     this.postInfo()
3 }

相關文章