在前端開發中,我們常常需要通過ajax技術來和后臺交互數據。而axios是最常用的http請求庫之一。今天,我們來探討一下如何使用axios來傳遞json對象。
首先,我們需要明確一下什么是json對象。JSON是JavaScript Object Notation的縮寫,是一種輕量級的數據交換格式。在前端開發中,我們常常需要把js對象轉換成json字符串,或者反過來,把json字符串解析成js對象。而axios默認的數據傳輸格式就是json。
axios({ method: 'post', url: '/api/user', data: { name: 'Tom', age: 18 } }).then(res=>{ console.log(res); }).catch(err =>{ console.error(err); });
如上代碼所示,我們向后臺發送post請求,在data屬性中傳遞了一個js對象。在axios內部會自動將它轉換成json格式的字符串。這里需要注意,如果要把json字符串轉換成js對象,可以使用JSON.parse()方法。
axios({ method: 'post', url: '/api/user', data: JSON.stringify({ name: 'Tom', age: 18 }) }).then(res =>{ console.log(res); }).catch(err =>{ console.error(err); });
如上代碼所示,我們在data屬性中傳遞了一個json字符串。在axios內部會自動將它轉換成json對象。如果需要手動轉換,可以使用JSON.stringify()方法。
除此之外,我們還可以在配置項中設置請求頭的content-type為application/json,這樣axios會自動把請求數據轉換成json格式的字符串。代碼如下:
axios({ method: 'post', url: '/api/user', headers: { 'content-type': 'application/json' }, data: { name: 'Tom', age: 18 } }).then(res =>{ console.log(res); }).catch(err =>{ console.error(err); });
到這里,我們就可以愉快地使用axios來傳遞json對象了。