[公理错误：{消息："用户验证失败：性别：路径'性别'是必需的。我正在使用猫鼬

Question

这是我第一次使用MongoDB。我正在用Node.Js在服务器端制作REST API，所有这些API在我的Postman上都能很好地工作。当我试图从Text Field向MongoDB输入值时，我没有遇到任何问题，但当我使用Select Box时，问题就来了&我受够了，请帮帮我。

我得到的错误AxiosError code: "ERR_BAD_REQUEST", message: "Request failed with status code 400", data: {message: 'User validation failed: gender: Path `gender` is required.'}

我的选择框

<div className='form-group col'>
<select
class="form-select form-select-sm"
value={gender}
onChange={(e) => setGender(e.target.value)}
required>
<option disabled selected aria-hidden>--Select Gender--</option>
<option value="Male">Male</option>
<option value="Female">Female</option>
</select>
</div>

我的保存功能

const saveUser = async (e) => {
e.preventDefault();
try {
await axios.post("http://localhost:4000/user", {
name,
email,
gender
});
navigate("/lists")
} catch (error) {
console.log(error);
}
}

我的API函数

export const saveUser = async (req, res) => {
const user = new User(req.body);
try {
const inserteduser = await user.save();
res.status(201).json(inserteduser);
} catch (error) {
res.status(400).json({message: error.message});
}

}

我的数据库模型

import mongoose from "mongoose";

const User = mongoose.Schema({
name:{
type: String,
required: true
},
email:{
type: String,
required: true
},
gender:{
type: String,
required: true
}
});

export default mongoose.model('User', User);

当我尝试使用文本字段传递一些值时，我没有遇到任何问题，但我认为是因为我使用的是选择框。也许我错过了什么或做错了什么，让我知道。

Answer 1

我刚刚解决了这个问题。问题是从选择框传递的值为空。所以我先用另一个const存储数据。

临时存储数据的常量

const [data, setData] = useState({
name: '',
email: '',
gender: ''
});

以及处理onchange事件的功能

function handle(e) {
const newData = { ...data };
newData[e.target.id] = e.target.value;
setData(newData);
console.log(newData);
};

这就是我从数据数组传递值的方式

const saveUser = async (e) => {
e.preventDefault();
try {
await axios.post("http://localhost:4000/user", {
name: data.name,
email: data.email,
gender: data.gender
})
.then(console.log(data));
navigate("/lists")
} catch (error) {
console.log(error);
}
}

这就是我从选择框中获取值的方式

<select
id='gender'
className="form-select form-select-sm"
value={data.gender}
onChange={(e) => handle(e)}
required>
<option selected hidden>--Select Gender--</option>
<option value="Male">Male</option>
<option value="Female">Female</option>
</select>