reactjs - React.js: Disable button when input is empty -

i'm new react.js, sorry if question sounds stupid you.

i'm trying disable button when input field empty. beest approach in react this?

i'm doing following:

<input ref="email"/>  <button disabled={!this.refs.email}>let me in</button> 

is correct?

it's not duplication of dynamic attribute, because i'm curious transferring/checking data 1 element another.

you'll need keep current value of input in state (or pass changes in value up parent via callback function, or sideways, or <your app's state management solution here> such gets passed component prop) can derive disabled prop button.

example using state:

<meta charset="utf-8">  <script src="https://fb.me/react-0.13.3.js"></script>  <script src="https://fb.me/jsxtransformer-0.13.3.js"></script>  <div id="app"></div>  <script type="text/jsx;harmony=true">void function() { "use strict";    var app = react.createclass({    getinitialstate() {      return {email: ''}    },    handlechange(e) {      this.setstate({email: e.target.value})    },    render() {      return <div>        <input name="email" value={this.state.email} onchange={this.handlechange}/>        <button type="button" disabled={!this.state.email}>button</button>      </div>    }  })    react.render(<app/>, document.getelementbyid('app'))    }()</script>