分配给窗体的对象属性显示为对象对象，而不是实际值

Question

我正在传递一个名为"团队；React中的此函数。"；团队；对象有4个不同的属性。

id、playerName、typeId和locationName。

我正在填充这样的状态值：

const [idValue, setIdValue] = React.useState(false);
const [typeIdValue, setTypeIdValue] = React.useState(false);
const [nameValue, setNameValue] = React.useState(false);
const [locationValue, setLocationValue] = React.useState(false);

我的函数看起来像这样设置上面的状态值。

const showEdit = (team) => {
console.log(team);
setShowRosterForm(true);
setIdValue(team.id);
setTypeIdValue(team.typeId);
setNameValue(team.playerName);
setLocationValue(team.locationName);
}

然后我以这样的形式显示这些值：

const RosterForm = ({
idValue, typeIdValue, nameValue, locationValue
}) => ( ... display form fields )

但是当我用这些值填充表单时，我只看到[object object]。

但我不明白，因为当我将"team"对象输出到控制台时，我可以看到所有单独的属性，如id、typeId、playerName和locationName。

所以我不知道为什么它是一个对象。

有更好的方法吗？

谢谢！

Answer 1

您不需要将状态getter传递到RosterForm()中。你可以不直接使用gettertypeIdValue和其他来设置表单吗？

请在您的RosterForm()中打印一个console.log(typeIdValue)，以便您可以看到它收到的值。

我认为表单的值设置可能不正确。你能更新你的代码，将值设置为表单的一个字段吗？