изменить значение ключей в ключе объекта как тоггл в react
У меня есть такой стейт с ключами и дочерними ключами. И я хочу изменить значение true
на false
, и на оборот по принципу тоггл. Я пробую обращаться к нужному мне ключу, и это работает, если у меня только один родительский ключ в объекте, но не работает, если у меня несколько родительских ключей.
Подскажите, где исправить ошибку? Спасибо!
const [Layers, setLayers] = useState({
KeyParentOne: { Control: true, DropDown: false },
KeyParentTwo: { Control: true, DropDown: false }
});
<button onClick={() => {
setVal((prevState) => ({ KeyParentOne: { ...prevState.KeyParentOne, Control: !prevState.KeyParentOne.Control} }))}
>
Click
</button>
<button onClick={() => {
setVal((prevState) => ({ KeyParentOne: { ...prevState.KeyParentOne, DropDown: !prevState.KeyParentOne.DropDown} }))}
>
Click
</button>
<button onClick={() => {
setVal((prevState) => ({ KeyParentTwo: { ...prevState.KeyParentTwo, Control: !prevState.KeyParentTwo.Control} }))}
>
Click
</button>
<button onClick={() => {
setVal((prevState) => ({ KeyParentTwo: { ...prevState.KeyParentTwo, DropDown: !prevState.KeyParentTwo.DropDown} }))}
>
Click
</button>