axios是一個流行的基于Promise的客戶端HTTP庫,可以幫助我們方便地發送請求和處理響應。在實際的開發中,有時我們需要使用get請求來傳遞JSON參數,下面我們就來看一下如何使用axios傳遞JSON參數。
在使用axios進行get請求時,我們可以通過在URL后面添加查詢參數來傳遞JSON參數,例如:
import axios from 'axios';
const params = {
name: 'John',
age: 18,
address: {city: 'Beijing', street: 'Xisanqi'}
};
axios.get('/api/user', {params})
.then(response =>{
console.log(response.data);
})
.catch(error =>{
console.log(error);
});
上面的代碼中,我們通過在URL后面添加查詢參數params來傳遞JSON參數。我們定義了一個params對象,其中包含了name、age和address三個屬性,address屬性是一個嵌套的對象。
在axios.get方法中,我們將params對象傳遞到了第二個參數中,axios會將它自動添加到URL后面,生成類似于這樣的URL:/api/user?name=John&age=18&address=%7B%22city%22%3A%22Beijing%22%2C%22street%22%3A%22Xisanqi%22%7D。
需要注意的是,當我們使用get請求時,數據會以查詢字符串的形式附加到URL后面,這可能會導致一些重要信息暴露在URL中,因此我們需要對數據進行編碼。在上面的示例中,我們使用了JSON.stringify方法將params對象轉換成了JSON字符串,可以更好地保護數據。