React-select: Problem using react-select in Electron

[panpetedextra]

Hi,

I use this basic example in Electron

options = [
    { value: 'one', label: 'One' },
    { value: 'two', label: 'Two' }
  ];

  logChange(val) {
    console.log('Selected: ' + JSON.stringify(val));
    this.setState({
      value: val ? val.value : null
    });
  }

<ReactSelect
    name="form-field-name"
    options={this.options}
    onChange={this.logChange}
    value={this.state.value}
/>

and got the error

Uncaught Error: addComponentAsRefTo(...): Only a ReactOwner can have refs. You might be adding a ref to a component that was not created inside a component's render method, or you have multiple copies of React loaded (details: https://fb.me/react-refs-must-have-owner).

I found that the error appear when the value is set.
If remove value then the display is correct but after select a value then the error appear again.

[acordiner92]

I had this issue before when using react-select lib. Ended up being nothing related to this library but rather another npm library was installing react as a dependancy. This caused node_modules to have 2 copies of react install which react doesn't like. To fix have a look at this https://medium.com/@dan_abramov/two-weird-tricks-that-fix-react-7cf9bbdef375

[panpetedextra]

Thank you for your reply @acac99
unfortunately I tried to follow instruction on your link and it seems that I have only 1 React running

[davidmote]

Hello, I had a similar error when working on a package that uses react-select with redux-form. After fixing the multiple version of react issue @acac99 mentions, I was still having this issue on single select fields.

I was able to fix the issue by setting joinValues={true} on my Select Component, which caused a different hidden input to be generated, and the error went away.

[schempil]

@davidmote any idea why this worked? Its just sending the values in an extra hidden field. I just want to understand, because this error was extremly confusing.

I used multiple react-selects in my app. Some of them worked, some of them crashed, when I wanted to update the state with the selected object.

But thank you! joinValues={true} solved it for me!

[tdiluzio]

@davidmote I've been trying to fix it for several hours thanks it worked for me as well

[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.