[英]Unable to change state of checkbox dynamically using setState
以下是一个简单的react组件,其复选框的初始状态为false。
我正在尝试使用setState()动态更改它。 这是行不通的。
这是我的代码:
var Hello = React.createClass({
getInitialState: function(){
return {
checked : this.props.checked.toString() === "false" ? false : true
};
},
render: function() {
console.log("rendering==");
return <div><input type = "checkbox" defaultChecked = {this.state.checked}/></div>;
}
});
var compRef = React.render(<Hello checked = "false" />, document.body);
Trying to change state after rendering the component
setTimeout(function(){
compRef.setState({checked: true})
},3000);
我无法使用setState更改复选框状态。
这是一个小提琴
通过提供defaultChecked
而不是checked
,可以创建不受控制的组件 。 不受控制意味着您无法通过更改defaultChecked
来控制它。 要从代码更改复选框的状态,您需要提供checked
状态。
这是更新的小提琴: http : //jsfiddle.net/p4ps7nob/
要考虑的另一件事是: getInitialState中的道具是一个反模式
如果要切换复选框输入的状态,则需要使用带有onChange
处理函数的checked
而不是使用defaultChecked
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.