onChange doesn't trigger when state updated

Hi,

Thanks for the react-select!

I googled and I found nothing, so I opened this issue and I don’t know if this is an issue or not.

In Select2 world, triggering onChange is simple as this:

$('select').val('NEW_VALUE').trigger('change');

I think react-select is the replacement to select2 for react developers.

Is there any way to do the same with react-select?

class MyCom extends Component {
    constructor(){
        this.items = [{ label: 'one', value: 1} , { label: 'two', value: 2} ];
        this.state = { 
            selected: { label: 'one', value: 1}			
        };
    }
	
    handleChange(selectedValue){
        console.log(selectedValue);
    }
	
    someEvent() {
        // selected item will be updated after following code but handleChange doesn't trigger.
        this.setState({selected: { label: 'two', value: 2}});
    }
	
    render(){
        return (
            <Select
                onChange={this.handleChange}
                value={this.state.selected}
                options={this.items}
            />
        );
    }
}

Thanks.

[dehghani-mehdi]

@ShivaniBali if you use markdown to format your code it would be helpful.

React Select doesn’t give you JS event in its onChange like standard html select element, I mean you can not go for e.target.value, instead it gives you selected object. change your handleChange method like below and you are good to go:

handleChange(selectedItem) {
    this.setState({
        inputValue: selectedItem
    });
    console.log("inputValue=" + selectedItem);
}

selectedItem here is an object contains value and label.

[bladey]

Apologies @dehghani-mehdi, my mistake - the communications in this issue were mixed up.