[英]React: Have a return statement but "Nothing was returned from render. This usually means a return statement is missing"
I have a component that I'm currently trying to render.我有一个正在尝试渲染的组件。 I put a return statement but I am still displaying an error.
我放了一个返回语句,但我仍然显示错误。
import React, { useState } from 'react';
import moment from 'moment';
import {FaSpaceShuttle} from 'react-icons/fa';
export const TaskDate = ({ setTaskDate, showTaskDate, setShowTaskDate }) => {
return (
showTaskDate && (
<div className="task-date" data-testid="task-date-overlay">
<ul className="task-date__list">
<li>
<div
onClick={() => {
setShowTaskDate(false);
setTaskDate(moment().format('DD/MM/YYYY'));
}}
>
<span>
<FaSpaceShuttle />
</span>
<span>Today</span>
</div>
</li>
</ul>
</div>
)
);
};
Any help would be appreciated!任何帮助,将不胜感激!
The problem is that when showTaskDate
is undefined
you don't render anything, you simply return undefined
.问题是当
showTaskDate
是undefined
你不渲染任何东西,你只是返回undefined
。
You can change your return
to use conditionals and return null
to render nothing if there is no showTaskDate
set.如果没有设置
showTaskDate
,您可以更改return
以使用条件并返回null
以不呈现任何内容。
export const TaskDate = ({ setTaskDate, showTaskDate, setShowTaskDate }) => {
return (
showTaskDate ? (
<div className="task-date" data-testid="task-date-overlay">
<ul className="task-date__list">
...
</ul>
</div>
) : null
);
};
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.