我试图在输入字段为空时禁用按钮。 React 中最好的方法是什么？
我正在做类似以下的事情：
<input ref="email"/>
<button disabled={!this.refs.email}>Let me in</button>
它是否正确？
这不仅仅是动态属性的重复，因为我也对将数据从一个元素传输/检查到另一个元素感到好奇。
您需要将输入的当前值保留在状态中（或传递其值的更改）通过回调函数发送给父级 https://github.com/ryanflorence/react-training/blob/gh-pages/lessons/03-simple-component-communication.md, or sideways https://github.com/ryanflorence/react-training/blob/gh-pages/lessons/04-less-simple-communication.md, or 这样它最终会作为 prop 传递回您的组件），以便您可以派生按钮的禁用 prop。
使用状态的示例：
<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>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
