#javascript #node.js #reactjs #material-ui
#javascript #node.js #reactjs #материал-пользовательский интерфейс
Вопрос:
у меня есть группа кнопок из пользовательского интерфейса Material, и код находится здесь
const [currentProjectSelect, setCurrentProjectSelect] = useState(null);
Это мое состояние.
<ButtonGroup size="small" className={classes.projectTypeButton}>
{projectType === 'offPlatform' amp;amp; projectTypeValues.map((element, index) =>
<Button
key={element.value}
variant="contained"
color="primary"
className={[classes.budgetButton, {backgroundColor: currentProjectSelect === index ? '#315FFF' : '#fff'}]}
onClick={() => {
if (currentProjectSelect === null){
form.budget_type = element.value
setCurrentProjectSelect(element.name)
}
else {
setCurrentProjectSelect(null)
}
}
}
>{element.name}</Button>
)}
</ButtonGroup>
Здесь, в className, я пытаюсь реализовать логику, в которой выбранная кнопка будет иметь другой цвет фона. Это не работает. Раньше я был разработчиком react native, и та же логика использовалась для работы со стилями.
Комментарии:
1. Вам нужно использовать кнопки переключения , а не ButtonGroup.