React-select: Unable to get access to the event object

[lingpri]

How do I get access to the event object when the OnChange() method fires. I would like the target name when the event is fired.

I can do this below:
handleChange (value) {
this.props.updateAreaValue(value);
}

Instead I need this:

handleChange (value,event) {
this.props.updateAreaValue(value,event);
}

[MarkLeMerise]

Hi @lingpri, I was wondering if you could expand a bit more on your use case and why you need the event object?

[a6hi5h3k]

@MarkLeMerise One usecase as per me would be, to peek into event object and check value of metaKey/altKey flag. This can come handy to figure out if Cmd/Ctrl/Alt key was pressed at the time of selecting an option, which can lead to some special handling.

[lingpri]

@MarkLeMerise : I dynamically generate react-select tags by reading a json select tags. If I can get the event object, I can see which element was changed and alter my state based on the selection. This would help me eliminate lot of boiler plate code I would have to write for the change handlers. The HTML5 select tag does provide the event object for the change handler and I think it would come in handy.

[MarkLeMerise]

@lingpri You might try passing a name to your onChange handler if you need to know which instance changed:

var views = jsonData.map(obj => <Select name={ obj.name } onChange={ value => handleChange(value, obj.name) } />);

As I did in the example, you can pass a name prop to a <Select> and that'll be the name of the underlying hidden <input>.

In that way, react-select is different from a native <select>. As a higher-order component, react-select abstracts the DOM away from you, so you usually shouldn't need to know an event's DOM source.

[lingpri]

@MarkLeMerise - Thanks for the pointer. closing the issue.

[sslgeorge]

This issue should not be closed, I think it is a real issue that the application is not able to access the event object, there are hundreds of cases when I will want to take a look at the event object. Without the event object it means my select component will need a different handler from my regular input elements, which in my humble opinion does not make sense.

[daggmano]

Unless anyone knows differently, it seems that usage of react-select with formik would require access to the event object.

[elramus]

@daggmano Yup, coming to that conclusion as well. Would love it if these two could play nice together.