react管理组件的问题

Question

我正试图在Edit内部使用TabbedShowLayout，但这返回了一个与缺少道具有关的错误：

错误的打印

这是我的代码：

export const BarberEdit = (props) => {
const [id, setId] = useState(props.id);
const [name, setName] = useState("");
const [phone, setPhone] = useState("");
const [birthday, setBirthday] = useState(Date);
const [transport, setTransport] = useState("");
const [email, setEmail] = useState("");
function handleSubmit() {
console.log("alguma coisa.");
}
return (
<Edit {...props} title={<BarberEditTitle />}>
<TabbedShowLayout>
<Tab label="Perfil">
<SimpleForm submitOnEnter={false}>
<TextInput source="name" />
<TextInput source="phone" />
<DateInput source="birthday" />
<TextInput source="transport" />
<TextInput source="email" />
</SimpleForm>
</Tab>
<Tab label="Endereço">
<ReferenceManyField
label=""
reference="barbers_addresses"
target="barberId"
>
<Datagrid>
<TextField source="street" label="Rua" />
<TextField source="city" label="Cidade" />
<TextField source="district" label="Bairro" />
</Datagrid>
</ReferenceManyField>
</Tab>
</TabbedShowLayout>
</Edit>
);
};

稍微阅读一下react管理文档，我发现SimpleForm有两个继承的属性。

提前感谢！

Answer 1

对于编辑和创建布局，应该使用TabbedForm，而不是TabbedShowLayout，此外，不需要将SimpleForm用作Tab子项，并且可以将submitOnEnter直接传递给TabbedForm

export const BarberEdit = (props) => {
const [id, setId] = useState(props.id);
const [name, setName] = useState("");
const [phone, setPhone] = useState("");
const [birthday, setBirthday] = useState(Date);
const [transport, setTransport] = useState("");
const [email, setEmail] = useState("");
function handleSubmit() {
console.log("alguma coisa.");
}
return (
<Edit {...props} title={<BarberEditTitle />}>
<TabbedForm submitOnEnter={false}>
<FormTab label="Perfil">
<TextInput source="name" />
<TextInput source="phone" />
<DateInput source="birthday" />
<TextInput source="transport" />
<TextInput source="email" />
</FormTab>
<FormTab label="Endereço">
<ReferenceManyField
label=""
reference="barbers_addresses"
target="barberId"
>
<Datagrid>
<TextField source="street" label="Rua" />
<TextField source="city" label="Cidade" />
<TextField source="district" label="Bairro" />
</Datagrid>
</ReferenceManyField>
</FormTab>
</TabbedForm>
</Edit>
);
};