问题描述
目前有一个问题,当尝试从我的前端完成 POST 请求时,返回除 ID 之外的所有内容都具有空值的对象。我也没有在控制台中收到任何错误消息。我已经使用 Insomnia 测试了我的服务器,并且我的 POST 一切正常。我还尝试将 newEntry 的主体从大括号中取出并包含标题(即使 Mithril 的文档没有显示使用它们)。
前端
const setData = formDOM => {
const formData = new FormData(formDOM);
console.log("formData",formData)
const newEntry = {};
Array.from(formData.entries()).map(entryValue => {
const key = entryValue[0];
const value = entryValue[1];
switch (value) {
case "false":
newEntry[key] = false;
break;
case "true":
newEntry[key] = true;
break;
default:
newEntry[key] = value;
break;
}
});
console.log("new entry",newEntry)
m.request({
method: 'POST',url: 'http://localhost:5000/santaslist',body: {
newEntry
}
}).then((person) => {
console.log("updated entry",person)
});
}
const EntryForm = {
// state
data: {
name: "",street: "",state: "",city: "",zipcode: "",nice: false,naughty: false,clicked: false,},// const { name,street,state,city,zipcode,nice,naughty } = data,view: (vnode) => (
<form name="entry-form" id="entry-form">
...
<button
class="ui-button"
type="button"
data-toggle="modal"
data-target="#exampleModal"
onclick={() =>
{ setData(vnode.dom)}
}
> Add </button>
...
</form >
),};
export default EntryForm;
后端
const app = express()
const cors = require("cors")
const pool = require("./db")
const bodyParser = require("body-parser")
// middleware
app.use(cors())
app.use(express.json())//req.body
app.use(bodyParser.json())
app.use(bodyParser.urlencoded({
extended: true
}))
//ROUTES//
//create a list item (POST)
app.post("/santaslist",async(req,res) => {
console.log(req.body)
// console.log(req.headers)
// console.log(res)
try {
const { name,naughty,nice } = req.body
const newListItem = await pool.query("INSERT INTO listitems(name,nice) VALUES ($1,$2,$3,$4,$5,$6,$7) RETURNING *",[name,nice])
res.json(newListItem.rows)
} catch (err){
console.error(err.message)
}
})
entry: trailing-whitespace-fixer
解决方法
您的代码有点过于复杂,而且您使用了错误的 IMO 方法。 map
用于创建一个新数组,其中转换了现有数组的元素。你想要的是forEach
。
试试这个。
let newEntry = {};
(formData.entries()).forEach(entry => {
const [key,value] = entry;
newEntry[key] = value === "true" ? true : false;
})
更新
正如您在回复中指定的 formData.entries()
是一个对象而不是数组,应注意您不能映射对象。但是,您可以执行 for
循环:
const entries = formData.entries();
let newEntry = {};
for (const key in entries)
newEntry[key] = entries[key] === "true" ? true : false;
})
,
我能够弄清楚,我使用了 data 选项而不是 body。
m.request({
method: 'POST',url: 'http://localhost:5000/santaslist',// body: newEntry,data: newEntry
}).then((person) => {
// addPersonToList(person)
console.log("updated entry",person)
});
}