изменить значение ключей в ключе объекта как тоггл в 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>

Ответы (1 шт):

Автор решения: Qwertiy
{ ...prevState, KeyParentOne: {
→ Ссылка