ReactJS - изменить значение атрибута при нажатии

Я думаю, что лучший способ сделать это - включить все ваши компоненты в компонент с отслеживанием состояния, который будет отслеживать, какой из ваших элементов выбран или нет. Затем этот компонент будет иметь функцию (что-то вроде handleClick), которая будет принимать этот класс кнопок нажатия и setState, изменяющийся на элемент, который должен быть выбран сейчас. Теперь вы можете передать функцию и состояние (то, что в настоящее время предполагается выбрать) в качестве реквизита для дочерних элементов, и onClick on вызовет обратный вызов родительскому компоненту, сообщающий об этом setState. Затем в каждом из отдельных компонентов вы можете просто проверить, есть ли опора this.props.currentSelect === ${name of the element}, чтобы увидеть, следует ли выбрать этот элемент или нет.

// some jsx file
class StatefulComponent extends React.Component{
  constructor(props){
    super(props);
    this.state = {
      currentlySelect: "someMenuItem"
    }
    this.handleClick = this.handleClick.bind(this);
  }

  handleClick(str){
    this.setState({
      currentlySelect: str
    })
  }

  render(){
    return(
      <React.Fragment>
        <NavigationButton to = "/" label = "Dashboard" exact>
          <MenuItem handleClick = {this.handleClick} currentlySelect = {this.state.currentlySelect}  className = {classes.menuItem} selected = {true / false}>
            <ListItemIcon className = {classes.icon}>
              <Home />
            </ListItemIcon>
            <ListItemText classes = {{ primary: classes.primary }} inset primary = "Strona główna" />
          </MenuItem>
        </NavigationButton>
        <NavigationButton to = "/payment" label = "Payment" exact>
          <MenuItem handleClick = {this.handleClick} currentlySelect = {this.state.currentlySelect} className = {classes.menuItem} selected = {true / false}>
            <ListItemIcon className = {classes.icon}>
              <Payment />
            </ListItemIcon>
            <ListItemText classes = {{ primary: classes.primary }} inset primary = "Moje płatności" />
          </MenuItem>
        </NavigationButton>
      </React.Fragment>
    )
  }

}