Да, вы могли бы достичь этого, установив переменную состояния в зависимости от имени отправляемого модала, например, так:
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
Вам не нужно .id
если у Вас уже есть элемент. Вручите его непосредственно jQuery:
jQuery(elementToUpdate).animate({ backgroundColor: '#ffffff' }, 1000);
Вы не получаете ошибку потому что elementToUpdate.id
строка, которую jQuery (вероятно), интерпретирует как селектор. Это просто, оказывается, селектор, который ничего не выбирает.
С другой стороны, можно сказать это для создания этого допустимым селектором:
jQuery('#' + elementToUpdate.id).animate({ backgroundColor: '#ffffff' }, 1000);
Но я думаю, что первая форма предпочтительна, так как у Вас уже есть сам элемент.