2

我正在尝试学习如何在我的应用程序中使用 react-hook-form。

我有一个包含多个输入的表单。

我有一个 updateData 函数,它应该捕获和存储输入,但它似乎不起作用。每次我想渲染表单时,如果我在多步表单中返回一步,如果我不重新输入表单输入,它似乎会抛出错误。

在我的渲染页面上,我使用:

{state.data.title}
{state.data.PreregistrationEntities.map(PreregistrationEntities => <Paragraph><Text>This will be registered with {PreregistrationEntities.label}.</Text></Paragraph>)}

TypeError:无法读取未定义的属性“地图”。

如果我每次呈现表单输出页面时不填写预注册表单字段,则会引发错误,指出无法读取未定义的映射。

如果只能找到输出,我该如何渲染输出?在这种情况下,我宁愿有一个空白的未完成句子而不是错误消息?

这篇文章表明默认值 nil 可能会有所帮助。在我返回所有表单输入并开始将它们定义为空白之前 - 还有其他解决方案吗?

4

1 回答 1

2

如果不存在,您可以添加一个检查以不呈现:

{state.data.title}
{state.data.PreregistrationEntities && state.data.PreregistrationEntities.map(PreregistrationEntities => <Paragraph><Text>This will be registered with {PreregistrationEntities.label}.</Text></Paragraph>)}

更完整的解决方案是在不存在时添加一条消息

{state.data.title}
{state.data.PreregistrationEntities ?
    state.data.PreregistrationEntities.map(PreregistrationEntities => <Paragraph><Text>This will be registered with {PreregistrationEntities.label}.</Text></Paragraph>)
    : <Text>PreregistrationEntities does not exist</Text>}
于 2019-11-13T21:32:17.173 回答