我有一个通知组件，并且有一个超时设置。超时后我打电话this.setState({isTimeout:true})。
我想要做的是如果已经超时，我只想渲染什么：
render() {
let finalClasses = "" + (this.state.classes || "");
if (isTimeout){
return (); // here has some syntax error
}
return (<div>{this.props.children}</div>);
}
问题是：
返回 （）; // 这里有一些语法错误
是的，您可以，但是null如果您不想render从组件中获取任何内容，请不要空白，只需返回，如下所示：
return (null);
另一个重要的一点是，在 JSX 中，如果您有条件地渲染元素，那么在 的情况下condition=false，您可以返回这些值中的任何一个false, null, undefined, true。根据DOC：
booleans (true/false), null, and undefined是有效的孩子，他们将被忽略意味着他们根本不渲染。
所有这些JSX表达式都将呈现为相同的东西：
<div />
<div></div>
<div>{false}</div>
<div>{null}</div>
<div>{undefined}</div>
<div>{true}</div>
例子：
只有奇数值会被渲染，因为对于偶数值我们返回null.
const App = ({ number }) => {
if(number%2) {
return (
<div>
Number: {number}
</div>
)
}
return (null); //===> notice here, returning null for even values
}
const data = [1,2,3,4,5,6];
ReactDOM.render(
<div>
{data.map(el => <App key={el} number={el} />)}
</div>,
document.getElementById('app')
)<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<div id='app' />一些答案有点不正确，并指向文档的错误部分：
如果您希望组件不渲染任何内容，只需null按照文档返回：
在极少数情况下，您可能希望组件隐藏自身，即使它是由另一个组件呈现的。为此，请返回 null 而不是其渲染输出。
undefined例如，如果您尝试返回，则会收到以下错误：
渲染没有返回任何内容。这通常意味着缺少 return 语句。或者，不渲染任何内容，返回 null。
正如其他答案所指出的null，true,false和undefined是有效的子级，这对于在jsx 中进行条件渲染很有用，但是如果您希望组件不隐藏/渲染任何内容，只需返回null.
是的，您可以从 React 渲染方法返回一个空值。
您可以返回以下任何一项： false, null, undefined, or true
根据文档：
false,null,undefined, 和true是有效的孩子。他们根本不渲染。
你可以写
return null; or
return false; or
return true; or
return <div>{undefined}</div>;
然而return null是最优选的，因为它表示不返回任何内容
有点跑题，但如果你需要一个从不渲染任何东西的基于类的组件，并且你很乐意使用一些尚未标准化的 ES 语法，你可能想要去：
render = () => null
这基本上是一个箭头方法，目前需要transform-class-properties Babel 插件。React 不会让你定义一个没有render函数的组件，这是我能想到的满足这个要求的最简洁的形式。
我目前正在从文档中借用的ScrollToTop变体中使用这个技巧react-router。在我的例子中，组件只有一个实例并且它不渲染任何东西，所以“render null”的简短形式很适合在那里。
如果您使用的是 Typescript 并且您的组件/函数具有 return type React.Element，您将收到以下错误。
类型 'null' 不能分配给类型 'ReactElement<any, string | JSXElementConstructor>'。
解决办法是React.Fragment。
return <React.Fragment />
或者
return <></>