Javascript reactjs中的状态不为'；不变

reactjs类中的状态没有改变，尽管我使用了setState，返回了一个对象，并在构造函数中绑定了函数，下面是我的代码

export default class Vacations extends Component {
    constructor(props){
        super(props);
        this.state = {
            sat: false,
            sun: true,
            mon: false,
            tue: false,
            wed: false,
            thu: false,
            fri: false
        }
        this.handleEnabledChange = this.handleEnabledChange.bind(this);
    }

    handleEnabledChange(e){
        const targetName = e.target.name;
        const checkState = e.target.checked;
        console.log(targetName, checkState);
        this.setState((preState)=>{
            return Object.assign({},{
                ...preState,
                name: !checkState
            })
        }) 
    }

    render() {
    return (
      <div>        
        <Checkbox name="sat" checked={this.state.sat} label="Saturday" onChange={this.handleEnabledChange} disabled/>
        ...
      </div>
    )
  }
}

导出默认类休假扩展组件{
建造师（道具）{
超级（道具）；
此.state={
sat：错，
孙：是的，
蒙：错，
星期二：错，
星期三：错，
苏：错，
星期五：错
}
this.handleenablechange=this.handleenablechange.bind（this）；
}
可处理的更改（e）{
const targetName=e.target.name；
const checkState=e.target.checked；
console.log（targetName，checkState）；
此.setState（（预状态）=>{
返回Object.assign（{}{
…预先声明，
名称：！checkState
})
}) 
}
render（）{
返回(
...
)
}
}

---

有人能帮我修复吗？

状态已更改，但您正在向状态添加一个新属性

name

：

return Object.assign({},{
    ...preState,
    name: !checkState
})

您没有更改

sat

的值，这就是您的组件没有显示任何可见更新的原因。请注意，您从未使用过

targetName

你应该做：

this.setState({[targetName]: !checkState});

不需要使用回调，因为您不需要从以前的状态读取数据，也不需要手动合并以前的状态，React会为您执行此操作。

简化操作

handleEnabledChange(e){
    const targetName = e.target.name;
    const currentState = this.state[targetName]

    this.setState({
      [targetName]: !currentState
    })
}

---

另外，我注意到您已禁用了

道具打开复选框。对于禁用的控件，复选框事件将不会触发。
也许您也可以共享复选框组件？