Реагирующий, обернутый компонент menuItem не вызывает функцию onChange выбранного родительского компонента

Question

Я пытаюсь добавить свойство к компоненту пользовательского интерфейса (menuItem), обернув его в другой. Я назвал это menuItemValued. Код нового компонента выглядит следующим образом:

import React from 'react';
import MenuItem from '@material-ui/core/MenuItem';
//import { MenuItem as MaterialList } from '@material-ui/core/MenuItem';
import { connect } from 'react-redux';


class MenuItemValued extends React.Component {

    constructor(props) {
        super(props);
        this.props = props;
        //console.log(props);
        this.value = this.props.value;
        this.state = {

        };

    }


    render() {
        return (
            <MenuItem value={this.props.value}  onClick={this.props.changeGear}>{this.props.string}</MenuItem>
        );
    }

}

const mapStateToProps = (state, props) => {
  //console.log(props);
  return{
    outils : state.materielList

  }
}

const mapDispachToProps = (dispach, ownprops) => {
  console.log(ownprops);
  return{
    changeGear: () => dispach({type:'CHANGE', tool: ownprops.valeur})
    //changeGear: () => dispach({type:'CHANGE'})
  }
}

export default connect(mapStateToProps, mapDispachToProps) (MenuItemValued);

Проблема в том, что когда я помещаю этот компонент как дочерний элемент для выбранного компонента, он не вызывает onChange, когда я щелкаю по нему как другой обычный пункт меню делает. Вот пример с select, который, как у ребенка, работает обычный menuItem и пользовательский menu menuItem не работает:

<Select
                labelId="demo-controlled-open-select-label"
                id="demo-controlled-open-select"
                open={this.state.isOpen}
                onClose={this.props.changeGear}
                onOpen={this.handleOpen}
                value={this.state.property}
                onChange={this.handleChange}
                >

                <MenuItemValued value={100} valeur={109} onChange={() => this.handleClose()} string={"Taille 9"}/>
                <MenuItem value={110}>Taille 10</MenuItem>


                </Select>

Я не понимаю, что я пропустил, чтобы заставить работать новый компонент.