这些条件在 React 渲染中不起作用 [重复]

Posted 2023-02-21

【中文标题】这些条件在 React 渲染中不起作用 [重复]

【英文标题】：The conditions don't work in the React render [duplicate]

【发布时间】：2018-08-30 16:34:51

【问题描述】：

render() 
   console.log("render")
         return (
      <div className="cont">

() => 
  console.log("works!")

if(condition)
return(<div className="btnnav" onClick=(event) => this.change(event) 
></div>)

我尝试在 return 中添加一个条件，但出现此错误

【问题讨论】：

你用错了iife，也可以避免直接使用三元运算符进行条件渲染。

【参考方案1】：

正如错误试图告诉你的那样，你是在告诉 React 打印一个函数，这实际上没有任何意义。

你需要调用函数：

(() =>  ... return ...())

【参考方案2】：

你可以简化一下：

render() 
  return (
      <div className="cont">
       condition && <div className="btnnav" onClick=(event) => this.change(event)></div> 
      </div>
  );