React-select: Warning: Use the `defaultValue` or `value` props on <select> instead of setting `selected` on <option>

Created on 22 Mar 2016  路  3Comments  路  Source: JedWatson/react-select

Hi man, component looks great but I can't get even a simple test case to run.

Test code:

var Select = require('react-select');

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

render: function () {

        return (
            <Select 
                    name='whatever'
                    options={options}
                    value='one'
            />
        );
    }

Renders the first option on one line (as text), then a tiny input (1 character) below it with an x next to it, and gives the title warning in the console. Is this to do with the 1.0.0 changes? NPM installed 0.9.1, dependencies seemed to resolve fine (they're sitting in my node_modules, anyway). Packages.json only includes 'react-select' as a dependency, not the other two.

Any ideas?

picture jonorogers

Most helpful comment

Annnnndddd I'm an idiot. Apologies, issues were my shitty existing select causing the stated error and not referencing the css file correctly for the weird display issue.

picture jonorogers on 22 Mar 2016
👍4 😄2

All 3 comments

Annnnndddd I'm an idiot. Apologies, issues were my shitty existing select causing the stated error and not referencing the css file correctly for the weird display issue.

jonorogers picture jonorogers on 22 Mar 2016
👍4 😄2

<select className='Input--BorderBottom is-radiusless is-shadowless Font--Gray'> <option defaultValue disabled> Select Sexo </option> <option defaultValue selected> Masculino </option> <option defaultValue> With options </option> </select>

Warning: Use the defaultValue or value props on