這次帶給大家在vue裡使用post請求(附程式碼),在vue裡使用post請求的注意事項有哪些,下面就是實戰案例,一起來看一下。
vue開發過程中,總是會碰到一些問題,當然任何問題都不能阻止我們前進的腳步,話不多說,下面是我在開發過程中請求參數所碰到的問題
1,在暫時沒有後台資料的時候,post請求的參數大多會以 name:a,age:b 的格式去寫
import axios from 'axios'; axios.post(url,{ name:'0',age:'' },{emulateJSON: true}, { // 这里是跨域写法 headers:{"Content-Type": "application/x-www-form-urlencoded;charset=utf-8",} // 这里是跨域的写法 }).then(reponse=>{ console.log(reponse) this.tableData=reponse.data.data })
這樣寫法是沒有問題的,
2,若是後台已經寫好,但post的請求要以 name:a&age:b 的方式去寫的話,上面你的寫法就會請求不到數據,這時我們就要使用一個外掛來解決這個問題
2.1,安裝qs
npm install --save axios vue-axios qs
2.2,在請求的頁面加入
import qs from 'qs'; import axios from 'axios'; axios.post(url,qs.stringify({ // 通过qs.stringify()将对象解析成URL的形式 name:'0', age:'2' }),{emulateJSON: true},{ headers:{"Content-Type": "application/x-www-form-urlencoded;charset=utf-8",} }).then(reponse=>{ console.log(reponse) this.tableData=reponse.data.data })
相信看了本文案例你已經掌握了方法,更多精彩請關注php中文網其它相關文章!
推薦閱讀:
#以上是在vue裡使用post請求(附程式碼)的詳細內容。更多資訊請關注PHP中文網其他相關文章!