If-Else状态React.js

时间:2019-03-01 03:36:17

标签: javascript html reactjs

我试图基于状态值获取if-else语句。 设置我的代码的方式是随时更改<select>元素的状态。

我正在尝试做这样的事情:

if(this.state{value:} == "string")
{
   //Do this
}

但是似乎无法正确执行此操作。什么是更好的建议或正确的方法呢?

我正在尝试的实际代码:

  7     this.state = {value: 'empty'};
  8   }
  9   SelectChange = (event) => {
 10     this.setState({value: event.target.value});
 11     if(this.state[value] == "string" )
 12     {
 13       console.log("string");
 14     }
 15   }
 16   /*}
 17   AddListener = (event) => {
 18     var id = event.target.id;
 19     var selectElements = document.getElementById(id);
 20     var stringSpec = id.substr(10, 11);
 21     var specLeng = "specifySection" + stringSpec;
 22     //console.log("This Id: " + id + "NumString: |" + stringSpec + "| New Id: "     + specLeng);*/
 23     /*selectElements.addEventListener("change", function(){
 24       moreInfo(id, specLeng);
 25     }, false); */
 26   render (){
 27     const {SelectChange} = this;
 28     const {value} = this.state;
 29     return (
 30       <div>
 31         <div>
 32           <label><strong>New Field </strong></label>
 33           <div id="remove-" className="remove" style={{display: "inline", visibi    lity: "hidden"}}>
 34            <label> --Remove </label> <input type="checkbox" id="removeBox" class    Name="rmvCheckbox" />
 35             <br />
 36           </div>
 37           <label> Name: </label>
 38           <input id="name-" className="name" type="text" name="name" /> <br />
 39           <label> Description: </label>
 40           <input id="description-" className="description" name="description" />     <br />
 41           <label> Datatype: </label>
 42           <select value={value} onChange={SelectChange} id={`selectData-${this.p    rops.number}`} className="selectData" name="selectData" /*onClick={AddListener}*    />

3 个答案:

答案 0 :(得分:3)

this.setState({})是一个异步功能。因此,在此功能之后,当您在this.state.value条件下使用if时。该值尚未设置。因此您可以通过参数

传递值
if(event.target.value === "string")

或者您可以使用回调函数

this.setState({value: event.target.value}, () => {
  if(this.state.value === 'string') {
    // Do what you want here
  }
})

答案 1 :(得分:0)

尝试

if(this.state.value == "string"){
 //do this
}

选项2

this.state.value == "string" ? handleTrue() : handleFalse();

选项3 ..如果您只想检查

this.state.value && handleTrueLogic();

答案 2 :(得分:0)

您的语法错误。 value是动态的。应该是

if(this.state[value] == "string")
{
   //Do this
}