源碼
https://stackblitz.com/edit/r...

class App extends Component {
  constructor() {
    super();
    this.state = {
      name: 'React',
      checked:false,
    };
    this.handleChange=this.handleChange.bind(this)
  }
  handleChange(event){
    this.setState({
      checked:event.target.checked
    })
  }

  render() {
    return (
      <div>
        <Hello name={this.state.name} />
        <input checked={this.state.checked} onChange={this.handleChange} id='test' type='checkbox' />
        
        <span>color for test</span>
        <div>
          <label for='test' >test's label</label>
          <button onClick={()=>{
            this.setState({
              checked:undefined
            })
          }}>
            something
          </button>
        </div>
      </div>
    );
  }
}

在線演示(支持DevTool)
https://react-as5oze.stackbli...

問題是這樣的:

1. 如果this.state.checked一開始是true(藍色背景),那么我點一下勾選框(this.state.checked為false了),再點一下something按鈕,它又變成了藍色
2. 如果this.state.checked一開始是false(紅色背景),那么我點一下勾選框(this.state.checked為false了),再點一下something按鈕,它又變成了紅色

something按鈕的功能就是將checked設(shè)為undefined,請問這個按鈕為什么會出現(xiàn)上述這種看起來像'復(fù)原'的功能

補充(我實際遇到的問題):
一個設(shè)置頁,如果用戶點擊取消則將所有checkbox復(fù)原,經(jīng)過排查發(fā)現(xiàn)再復(fù)原方法中漏了一個state字段(這就導(dǎo)致這個字段在復(fù)原時設(shè)為undefined),但是從界面上卻是正常效果