React-select: Feature request: allow option value to be set to an object

[michaelchihuyho]

Copy of #572 since there seemed to be a misunderstanding of the core issue there. The desire here is to be able to set options that look like this:

var options = [
  {label: 'item 1', value: {id: 123, foo: 'bar'},
  {label: 'item 2', value: {id: 456, foo: 'baz'}
]

The reason this doesn't work currently is because of how this.props.value is interpreted to display the selected option.

1. Values that aren't strings or numbers aren't handled: https://github.com/JedWatson/react-select/blob/46ca406244704bba5e1e4adf63bc38dda1fb8fc8/src/Select.js#L423
2. Even if they were, === is not sufficient for comparing objects: https://github.com/JedWatson/react-select/blob/46ca406244704bba5e1e4adf63bc38dda1fb8fc8/src/Select.js#L427

Is setting values to objects a feature react-select is interested in supporting? If so, would it be okay to add a dependency on an object deep equality checker like node-deep-equal?

[jdgarcia]

Weird, I'm doing exactly that (see below) and it works as I would expect it.

const selectOpt = {
  label: item.label,
  value: item
};

For reference, I'm using version 1.0.0-beta9, so it might not be in pre 1.0.0

[michaelchihuyho]

Hmm I'm on beta8 but I'll try it out on a blank app withbeta9. My hunch is that it works for you because the value object is being passed around by reference when that might not be the case for me.

[FranBran]

unless I want to make the component _controlled_, it works for me as well. But as soon as I want to pass in values, it doesn't work as expected anymore as the value is compared to the options by indexOf(), which has the same issue as comparing objects by === (https://github.com/JedWatson/react-select/blob/master/src/Select.js#L689)

[bladey]

Hello -

In an effort to sustain the react-select project going forward, we're closing old issues / pull requests.

We understand this might be inconvenient but in the best interest of supporting the broader community we have to direct our limited efforts to maintain the latest version.

If you feel this issue / pull request is still relevant and you'd like us to review it, please leave a comment and we'll do our best to get back to you.

[vasilevich]

The issue seems not to be solved or is not well documented, please provide explanation how to use objects properly in react-select value?

[ebonow]

Greetings @vasilevich ,

The implementation for using objects as values seems fairly straight forward. Given this codesandbox example, what other questions or documentation is unclear?

I believe this should be marked resolved and closed given:
1) The original post is over 4 and half years old.
2) The original use case is for a v1 beta which has been long depreciated.
3) The expected behavior described in the initial post is no longer an issue (per the above example).
4) There are no other unresolved questions.

IF there are other questions and concerns, please feel to object, but I see no reason not to let this rest in peace.