Javascript 如何使用如果。。。渲染块之前的else 类应用程序扩展组件{ 建造师（道具）{ 超级（道具）； 此.state={ 检查1：错误， 检查2：错误， 检查文本：“ . . } oncheck=（e）=> { this.setState（{check1:！this.state.check1}） } oncheck2=（e）=> { this.setState（{check2:！this.state.check2}） } render（）{ if（this.state.check1==true）{ this.state.checktext=“标记为true”； } else if（this.state.check1==false） { this.state.checktext=“标记为false”； } . . . 返回( . . .

Text{this.state.checktext}

---

此代码正常工作，但控制台错误不会直接改变状态。请使用setState（）react/no direct mutation state。在渲染块之前如何使用if else。谢谢。

您应该执行以下操作：

class App extends Component {
  constructor(props) {
    super(props);
    this.state = {
      check1 : false,
      check2 : false,
      checktext : ""
      .
      .
      }

oncheck=(e)=>
{
  this.setState({ check1 : !this.state.check1})
}
oncheck2=(e)=>
{
  this.setState({ check2 : !this.state.check2})
}

 render() {
      if( this.state.check1 === true) {
        this.state.checktext= "Marked true";
      }
      else if(this.state.check1 === false)
      {
        this.state.checktext= "Marked false";
      }
      .
      .
      .
      return (
      .
      . 
      .
       <input type="checkbox" checked={this.state.check1} onChange={this.oncheck}/> <br />
      <input type="checkbox" checked={this.state.check2} onChange={this.oncheck2}/> <br />
      <p> Text {this.state.checktext}  </p>

---

请参阅文档了解更多信息：

您不需要状态来实现您正在做的事情，只需使用一个变量，如

  if(this.state.check1 === true) {
    this.setState({
      checktext= "Marked true";
    });
  }

像这样使用它

---

Text{checktext}

您可以在

render（）中调用
方法
，并在该方法中进行验证检查

例如：

 render() {
 var checktext=""
      if( this.state.check1 === true) {
        checktext= "Marked true";
      }
      else if(this.state.check1 === false)
      {
        checktext= "Marked false";
      }

在
doValidation（）
中，您可以检查验证

render(){
     this.doValidation();
     ....

只要微调@supra28 answer，如果var check1只能有true或false，那么您可以使用下面的代码，因为最好避免在可能的地方出现if条件

 doValidation(){ 
     if( this.state.check1 === true) {
         this.setState({check5: "Marked true"}); 
     } else if (this.state.check1 === false) {
         this.setState({check5: "Marked false"}); 
     } 
}

你有多少检查？永远不要直接改变状态。使用
this.setState（{YOUR_NEW_state}）
不要在
render
中改变状态。抱歉，编辑代码。上面有几个问题（在
渲染中修改状态
，直接修改状态，而不是通过
设置状态
，使用
==true
和
==false
，这是非常不合适的）。但在评论中，您每次都说这不是问题所在。如果没有更完整的示例，我们将无法帮助您。请使用演示问题的示例更新您的问题，最好是使用堆栈片段（
[]
工具栏按钮）运行的问题.Stack Snippets支持React，包括JSX；。我个人认为这不是推荐的方式，因为他在
状态
对象中有
checktext
。从我的角度看，这是非常混乱的it@Isaac处于该状态的checktext没有任何用处，它不是导致/必须导致渲染的原因，而是复选框导致了渲染负责任的，这是正确的方法，你不应该把不必要的东西放在实际上不是应用程序状态的状态。反应状态肯定被大多数人过度使用了。
render() {
   var checktext="";
   checktext = (this.state.check1 === true) ? "Marked true" : "Marked false";
}