javascript - React - changing an uncontrolled input -

i have simple react component form believe have 1 controlled input:

import react 'react';  export default class myform extends react.component {     constructor(props) {         super(props);         this.state = {}     }      render() {         return (             <form classname="add-support-staff-form">                 <input name="name" type="text" value={this.state.name} onchange={this.onfieldchange('name').bind(this)}/>             </form>         )     }      onfieldchange(fieldname) {         return function (event) {             this.setstate({[fieldname]: event.target.value});         }     } }  export default myform; 

when run application following warning:

warning: myform changing uncontrolled input of type text controlled. input elements should not switch uncontrolled controlled (or vice versa). decide between using controlled or uncontrolled input element lifetime of component

i believe input controlled since has value. wondering doing wrong?

i using react 15.1.0

i believe input controlled since has value.

for input controlled, value must correspond of state variable.

that condition not met in example because this.state.name not set. therefore, input uncontrolled. once onchange handler triggered first time, this.state.name gets set. @ point, above condition satisfied , input considered controlled. transition uncontrolled controlled produces error seen above.

by initializing this.state.name in constructor:

e.g.

this.state = { name: '' }; 

the input controlled start, fixing issue. see react controlled components more examples.

unrelated error, should have 1 default export. code above has two.