Очистить содержимое в поле выбора при изменении первого параметра выбора - reactJS

Question

Я новичок в ReactJS. Я использовал AntJS select в моем ReactJS проекте. У меня есть два select в HTML. Когда выбран first select, его относительное раскрывающееся меню будет загружено в second select.

Вид интерфейса:

Когда пользователь выбирает параметр в first select second select загрузит его содержимое.

Работало отлично. Теперь моя проблема была «Когда я выбираю опцию в second select, она есть в second select box. Но Когда я изменил опцию в first select, уже выбранная опция в second select все еще есть, но содержимое раскрывающегося списка в second select изменилось.

Моя проблема в представлении пользовательского интерфейса: Как очистить выбранное содержимое в поле second select, когда first select опция изменилась ". Я пытался до сих пор. Я не знаю, как это сделать. Помогите мне с некоторыми решениями.

Код:

WAAccountNameChange(value){  
        this.setState({selectedValue:"", waWebsiteList: this.state.waAccountWebsiteList[value] }) 
    }

Первый выбор:

<Select  " onChange= {(value) => { this.WAAccountNameChange(value)}} >
    {this.state.waAccountList.map((item, index) => <Select.Option value={item} key={index}>{item}</Select.Option>)}
</Select>

Второй выбор:

<Select  defaultValue={this.state.selectedValue}  onChange= {(value) => { this.setState({ selectedValue: value })} } >
    {this.state.waWebsiteList.map((item, index) => <Select.Option value={item} key={index}>{item}</Select.Option>)}
</Select>