React复选框未发送onChange

TLDR：使用defaultChecked而不是checked，工作jsbin

尝试设置一个简单的复选框，在选中时将其标签文本划掉。由于某些原因，当我使用该组件时，handleChange没有被解雇。谁能解释我做错了什么

var CrossoutCheckbox=React.createClass({
getInitialState:函数（）{
返回{
完成：（！！this.props.complete）| | false
};
},
handleChange:function（）{
console.log（'handleChange'，this.refs.complete.checked）；//永远不会被记录
这是我的国家({
完成：this.refs.complete.checked
});
},
render:function（）{
标签式变种={
“文本装饰”：this.state.complete？'line-through'：“”
};
返回(
&lt；span&gt；
&lt；标签样式={labelStyle}&gt；
&lt；输入
type=“复选框”
选中={this.state.complete}
ref=“完成”
onChange={this.handleChange}
/&燃气轮机；
{this.props.text}
&lt；/label&gt；
&lt；/span&gt；
);
}
});

用法：

React.renderComponent（CrossoutCheckbox（{text:“text text”，complete:false}），mountNode）；

解决方案：

使用checked不会让基础值发生变化（显然），因此不会调用onChange处理程序。切换到defaultChecked似乎可以解决此问题：

var CrossoutCheckbox=React.createClass({
getInitialState:函数（）{
返回{
完成：（！！this.props.complete）| | false
};
},
handleChange:function（）{
这是我的国家({
完成：！this.state.complete
});
},
render:function（）{
标签式变种={
“文本装饰”：this.state.complete？'line-through'：“”
};
返回(
&lt；span&gt；
&lt；标签样式={labelStyle}&gt；
&lt；输入
type=“复选框”
defaultChecked={this.state.complete}
ref=“完成”
onChange={this.handleChange}
/&燃气轮机；
{this.props.text}
&lt；/label&gt；
&lt；/span&gt；
);
}
});