如何在更改react中的选项时获得警报消息？

Question

我有一个ADD按钮，它允许我在下拉列表中选择的选项中添加一些对象。我还有一个函数附加到那个Add Button。

 onAddClicked = () =>{
        this.setState({
            showOptions: true
        }); 
       
    }


    <button type="button" onClick={this.onAddClick}
   style={{ float: "right",  marginLeft: "10px", marginRight: "10px" }}
    id="AddSelectedTag"
    className={((this.state.selectedOptions ?this.state.selectedOptions.length === 0 : true) ? 
    "re-btn-primary-inactive" : "re-btn-primary-blue")}disabled={(this.state.selectedOptions ? 
    this.state.selectedOptions.length === 0 : true) ? true : false}>Add 
    </button>

我可以选择和选择，很少有对象在它下面。现在，我需要显示一个错误消息，当我想改变我的选项后，选择了几个对象。我选择的选项状态为"this.state.selectedOptions“。我在努力

if(this.state.selectedOptions ? this.state.selectedOptions.value : null)
        {
          alert("selectedOptions value has changed");
        }

但每次单击Add按钮时都会返回一条警告消息，而不是当我试图更改状态时。

onViewAllTagClick = (event) => {
this.setState({
            showTagsSysController: true,
            selectedOptions: event,
        });
}


<li id="viewAllTags" className="re-exp-pak-edit-system-li">
 <div className="re-lbl-normal-12">
 <Select id="selectTags"
  styles={ddlUtils.getSnapDdlStyle(200)}
placeholder="Select Tag, Network or Hardware "
options={[{label:"Tag",value:2,isChild:0},
         {label:"Network",value:5,isChild:0},
         label:"Hardware",value:3,isChild:0},
                                            ]}
 value = { this.state.selectedOptions}
 isSearchable={false}
 isDisabled={this.state.isEdit === true}
 noOptionsMessage={() => null}
 onChange = {this.state.selectedSystems !== null ? this.onViewAllTagClick : null}>
</Select>

Answer 1

添加像componentDidUpdate这样的事件侦听器并比较道具

componentDidUpdate(prevProps) {
  if(this.props.selectedOptions !== prevProps.selectedOptions)
    alert("selectedOptions value has changed");
}