解決方式一
而在axios中的post請求要非常注意:
要設(shè)置合適的請求頭十电,一般采用x-www-form-urlencoded即可
Vue.prototype.axios = axios.create({
? headers: {'content-type': 'application/x-www-form-urlencoded'}
});
在我們npm安裝跑axios 時默認(rèn)就已經(jīng)設(shè)置過請求頭儒洛,我們無需更改驮瞧。
<script>
? export default {
? ? data() {
? ? ? return {
? ? ? ? article: [],
? ? ? }
? ? },
? ? methods: {
? ? ? onSubmit() {
? ? ? console.log(this.article);
this.axios.post(`http://myblog.test/Home/Index/edit`, this.article)
? ? ? .then((res) => {
? ? ? ? ? this.$router.push({name: 'Home'})
? ? ? })
? ? ? }
? ? }
? }
</script>
? var qs = require('qs')
//import qs from 'qs'
? export default {
? ? data() {
? ? ? return {
? ? ? ? article: [],
? ? ? }
? ? },
? ? methods: {
? ? ? onSubmit() {
? ? ? console.log(this.article);
this.axios.post(`http://myblog.test/Home/Index/edit`, qs.stringify(this.article))
? ? ? .then((res) => {
? ? ? ? ? this.$router.push({name: 'Home'})
? ? ? })
? ? ? }
? ? }
? }
解決方式二、
這樣的話我們就必須在每一個頁面上手動var qs = require('qs') 比較麻煩
有沒有解決辦法能,當(dāng)然有的。我們可以全局配置
首先全局引入qs
然后我們在填寫post請求時隅熙,將所有的
this.axios.post(`http://myblog.test/Home/Index/edit`,?qs.stringify(this.article))
修改可以正常使用,并且所有的post必須去掉?qs.stringify(this.article))
this.axios.post(`http://myblog.test/Home/Index/edit`,?this.article)
解決方式三:
在main.js中添加
import qs from 'qs' //引入
Vue.prototype.qs = qs? //全局加載,必須應(yīng)用
this.axios.post(`http://myblog.test/Home/Index/edit`, this.qs.stringify(this.article))
頁面直接只用this.qs.stringify調(diào)用
希望此篇文章對你有所幫助