Checked的传值出现错误,请问错误在哪,怎么修改

#1
import React from 'react';
export default class StaffItemPanel extends React.Component{
	constructor(props) {
    super(props);
    this.state = {
      checkall: false,
      checkbox: false
    };
  handleChange(event) {
		  var CheckAll = document.getElementById('all');
		  var CheckBox = document.getElementsByName('box');
     const target = event.target;
     const value = target.classname === 'all' ? CheckAll.checked : CheckBox.checked;
     const classname = target.classname;
     
		  if (CheckAll.checked == true)
			for (var i = 0; i < CheckBox.length; i++) {
				CheckBox[i].checked = false;
			};
		   if (CheckAll.checked == false)
			for (var i = 0; i < CheckBox.length; i++) {
				CheckBox[i].checked = true;
			};
			for (var i = 0; i < CheckBox.length; i++) {
				if (CheckBox[i].checked == true) {
					CheckBox[i].checked = false;
			}
		else {
					CheckBox[i].checked = true;
			}	
		};
    this.setState({
         classname: value
      });		  
	}
	render(){
		return (
		  <table>
		    <thead>
				<th> <input type="checkbox" classname='all' onChange={this.handleChange.bind(this)} checked={this.state.checkall} /> </th>
			  <th className='itemTd'>姓名</th>
				<th className='itemTd'>年龄</th>
				<th className='itemTd'>身份</th>
				<th className='itemTd'>性别</th>
				<th className='itemTd'>操作</th>
			</thead>
		    <tbody>
          <tr><td className='itemTd'><input type="checkbox" classname='box' checked={this.state.checkbox} onChange={this.handleChange.bind(this)}/></td></tr>
          <tr><td className='itemTd'><input type="checkbox" classname='box' checked={this.state.checkbox} onChange={this.handleChange.bind(this)}/></td></tr>
          <tr><td className='itemTd'><input type="checkbox" classname='box' checked={this.state.checkbox} onChange={this.handleChange.bind(this)}/></td></tr>
       </tbody>
		  </table>
		);
	}
}
  ReactDOM.render(
  <StaffItemPanel />,
  document.getElementById('root')
);
#2

具体的报错什么样子也要写上来啊