Synchronization of props with state is an anti-pattern about react-select

[dcousens]

@furqanZafar but you also have the case where if you omit a value="apple", the value is not nothing, but still changeable by a user, and onChange events are still fired.

Its more like, the prop is the optional source, but if it is omitted, the component assumes manages it instead.

At least, that is my understanding of how it should be. I'm still investigating whether this is actually the case.

[jamesjjk]

@dcousens @furqanZafar I believe this is still an issue - renders it difficult to use this component.. When utilising setState on any event it would trigger a render of the component..

[furqanZafar]

I ended up writing a whole new component that is completely stateless and avoids synchronisation of props with state.

It uses state for a particular value only if the user does not provide that value via props, otherwise it uses the value directly from props. This overcomes the problem stated by @dcousens, And makes it easier to maintain & add features.

https://github.com/furqanZafar/react-selectize

[jamesjjk]

@furqanZafar Thanks for sharing that, really nice piece of work - should put it out there, its very well written and overcomes the problems and anti-pattern used with react-select.

[dcousens]

Really nice component @furqanZafar
I've not seen Livescript before either :)

[furqanZafar]

Thanks!

Livescript has really helped speed up development time & improve code readability, one of the objectives of react-selectize is to raise awareness about how well Livescript gels with ReactJS due there functional nature.

Livescript is pretty, concise with rich syntax sugar, some of which just recently started appearing in ES6 such as destructuring (or pattern matching), enhanced object literals, template strings, classes & much more...

[gwyneplaine]

this is resolved in v2, we now maintain a separate stream for controlled props and internally managed state values. Please see the following docs for details.