React, проверьте состояние, если пара ключей существует в зависимости от параметра

IkeDoud спросил: 12 мая 2018 в 05:15 в: javascript

Итак, я пытаюсь понять, как использовать какую-либо всеобъемлющую функцию, чтобы уменьшить раздувание в моем приложении. У меня есть куча диалоговых окон, которые обрабатываются через состояние, похожее на это:

toggleSettingsDialogue = () => {
    this.setState({settingsOpen: !this.state.settingsOpen});
}

Я пытаюсь уменьшить эту функцию, которая повторяется для каждого дополнительного диалога, в один. Моя мысль состоит в том, чтобы передать два параметра: один для диалога, который должен быть открыт, а другой, который определяет состояние этого диалога - либо true, либо false.

Проблема в том, что я застрял выясняя, как проверить, прошел ли первый параметр (т.е. имя диалогового окна в состоянии) или нет.

Предположим, у нас есть состояние с ...

state = {
     diagSettingsOpen: false,
     diagAddItemOpen: false
}

Как я могу проверить, существует ли какая-либо строка, переданная как параметр внутри функции, или нет, а затем использовать этот ключ для установки состояния, если оно соответствует?

2 ответа

Есть решение
Jonas W. ответил: 12 мая 2018 в 05:20
 toggleSettingsDialogue = key => {
   if(key in this.state)
     this.setState(({[key]: val}) => ({[key]: !val}));
}
IkeDoud ответил: 12 мая 2018 в 05:31
Прекрасно работает, радует Джонаса!
Jonas W. ответил: 12 мая 2018 в 05:41
@IkeDoud рада помочь :)
Vivek ответил: 12 мая 2018 в 05:19

Вот как вы можете проверить то же самое -

let state = {
     diagSettingsOpen: false,
     diagAddItemOpen: false
}

function setState(stateName, value) {
    if (state.hasOwnProperty(stateName)) {
        state[stateName] = value;
    } else {
        console.log("invalid state");
    }
}

setState("diagSettingsOpen" ,true);
console.log(state);
setState("diagSettingsClose" ,true);