Как переключить несколько модалов с одной функцией и одним состоянием?

Использовать map() !!

comp = [x for x in map(f, l) if x]

f - это функция f(X), l - список

map() вернет результат f(x) для каждого x в списке.

1
задан Yerlan Yeszhanov 16 January 2019 в 15:05
поделиться

1 ответ

Да, вы могли бы достичь этого, установив переменную состояния в зависимости от имени отправляемого модала, например, так:

switchModal = modal => ev => {
    this.setState(prevState => ({ [modal]: !prevState[modal] }))
}

И затем привяжите свою функцию onClick следующим образом. Это установит функцию, связанную с onClick, с заданным первым значением:

class ModalOpener extends React.Component {
    constructor(props) {
        super(props)

        this.state = {
            feedback: false,
            review: false,
            menu: false
        }
    }

    switchModal = modal => ev => {
        this.setState(prevState => ({ [modal]: !prevState[modal] }))
    }

    render() {
        return(
            <>
                <button onClick={this.switchModal('feedback')}>A</button>
                <button onClick={this.switchModal('review')}>B</button>
                <button onClick={this.switchModal('menu')}>C</button>
            </>
        )
    }
}

Теперь вы можете получить доступ к каждому значению, выполнив следующее:

const { feedback, review, menu } = this.state
0
ответ дан Treycos 16 January 2019 в 15:05
поделиться
Другие вопросы по тегам:

Похожие вопросы: