如何解决如何修复预期在反应函数组件结束时返回值的 linter?
我创建了一个函数组件来呈现错误消息,但它有一个 linter 警告“预期在函数 'renderErrorMessage' 的末尾返回一个值一致返回
function renderError() {
if (errors.file) {
return (
<Grid item>
<Grid container direction="column">
<Grid item>
<Text size="14px" height="1.43" isError>
Error Data :
</Text>
</Grid>
{errors.file.map((message) => (
<Grid item key={message}>
<Text size="12px" isError>
{message}
</Text>
</Grid>
))}
</Grid>
</Grid>
);
}
}
解决方法
如果 errors.file
条件为假,您的函数将不会返回任何值,这就是您收到警告的原因。你可以像这样重构你的组件:
function renderError() {
if (!errors || !errors.file) {
return null;
}
return (
<Grid item>
<Grid container direction="column">
<Grid item>
<Text size="14px" height="1.43" isError>
Error Data :
</Text>
</Grid>
{errors.file.map((message) => (
<Grid item key={message}>
<Text size="12px" isError>
{message}
</Text>
</Grid>
))}
</Grid>
</Grid>
);
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。