我正在做一個小專案。該應用程式是用vue撰寫的，資料目前由json-server托管。
這個想法是能夠將新的待辦事項發布到 json 資料檔案中。更新資料作業得很好，但是我在將新元素發布到 json 時遇到了問題。
我正在呼叫一個handleSubmit()方法、console.log()專案詳細資訊和專案物件。
我正在嘗試插入Test Title和Lorem Ipsum dolor sit.以及一個布林值，它自動設定為 false。
handleSubmit() {
console.log(this.title, this.details)
// console: Test Title Lorem Ipsum dolor sit.
let project = {
title: this.title,
details: this.details,
completed: false,
}
console.log(project)
// console: {title: 'Test Title', details: 'Lorem Ipsum dolor sit.', completed: false}
fetch('http://localhost:3000/projects', {
method: 'POST',
header: { 'Content-Type': 'application/json' },
body: JSON.stringify(project)
})
//.then(() => this.$router.push('/'))
.catch(err => console.log(err))
}
data.json 檔案得到更新，但只設定了 id。在這個例子中，id 1 和 id 2 的條目之前存在。
[
{
id: 1,
title: "Create new Homepage Banner",
details: "Lorem Ipsum dolor sit amet goes here.",
completed: false
},
{
id: 2,
title: "Very important E-Mail",
details: "Someone is waiting for your response. Better get this going.",
completed: true
},
{
id: 3
}
]
我對 vue 很陌生，我對在哪里除錯這個問題有點迷茫？控制臺不回應錯誤，json-server 控制臺只輸出POST /projects 201 31.323 ms - 13
編輯：
一旦我將問題提交給 stackoverflow，我就發現了我的錯誤。header: { 'Content-Type': 'application/json' }應該是headers。
無論如何，如果有人能夠幫助如何除錯將來的問題，我將非常感激！
uj5u.com熱心網友回復：
一旦我將問題提交給 stackoverflow，我就發現了我的錯誤。
header: { 'Content-Type': 'application/json' }
應該
headers: { 'Content-Type': 'application/json' }
uj5u.com熱心網友回復：
將此行添加到標題 'Accept': 'application/json'
fetch('http://localhost:3000/projects', {
method: 'POST',
header: {
'Content-Type': 'application/json',
'Accept': 'application/json'
},
body: JSON.stringify(project)
})
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/342608.html