Javascript 如何在react中获取boolean类型的props值

我已经创建了一个组件，在其中我传递了两个道具-taskName是字符串，status是布尔值。我在我的

App.js

中找到了获取taskName的方法，但在布尔类型的情况下失败了

react不支持布尔道具吗

TaskComponent.js

export default class TaskComponent extends Component {
    render() {
        var taskStatus = this.props.status;
        if(taskStatus)
            return <h1><strike>Task: {this.props.taskName}</strike></h1>
    }
}

class App extends Component {
  render() {
    return (
      <TaskComponent taskName="Buy Milk" status={false} />
    );
  }
}

export default App;

导出默认类TaskComponent扩展组件{
render（）{
var taskStatus=this.props.status；
如果（任务状态）
返回任务：{this.props.taskName}
}
}

App.js

export default class TaskComponent extends Component {
    render() {
        var taskStatus = this.props.status;
        if(taskStatus)
            return <h1><strike>Task: {this.props.taskName}</strike></h1>
    }
}

class App extends Component {
  render() {
    return (
      <TaskComponent taskName="Buy Milk" status={false} />
    );
  }
}

export default App;

类应用程序扩展组件{
render（）{
返回(
);
}
}
导出默认应用程序；

我在尝试获取状态值时遇到此错误

TaskComponent.render（）：必须返回有效的React元素（或null）。您可能返回了未定义、数组或其他无效对象

---

因为当状态为false时，您没有返回任何内容（默认情况下，它将返回未定义的，这就是您得到错误的原因），您忘记了else条件，当状态为

false时，您需要返回一些内容

如果您不想
渲染
任何内容，则
返回null

这样写：

render() {
    var taskStatus = this.props.status;
    if(taskStatus)
        return <h1><strike>Task: {this.props.taskName}</strike></h1>
    else return null;
}

render（）{
var taskStatus=this.props.status；
如果（任务状态）
返回任务：{this.props.taskName}
否则返回null；
}
返回空值是
任务状态
为false，这就是您得到错误的原因，因为如果条件不匹配，则不会返回任何内容是


类应用程序扩展了React.Component{
render（）{
返回(
);
}
}
类TaskComponent扩展了React.Component{
render（）{
var taskStatus=this.props.status；
如果（任务状态）
返回任务：{this.props.taskName}
其他的
返回空
}
}
ReactDOM.render（，document.getElementById（'app'））
呈现什么
返回
如果（！taskStatus）
？哇，快速响应：），我正在等待接受您的回答。7分钟。。。