选择后，React Material选择不显示值

Question

我希望完成我正在使用的语言软件。不幸的是，我一直在选择组件的反应材料方面遇到问题。我似乎无法让他们正常工作。在下面的示例中，我选择的值未显示在UI中。

JSX

<FormControl>
  <InputLabel htmlFor="nativeLanguageSelect">Select Language You Already Know</InputLabel>
  <Select
    onChange={ this.nativeLanguageChange }
    inputProps={{
      name: 'nativeLanguage',
      id: 'nativeLanguageSelect'
    }}
    value={ this.state.nativeLanguageDescription }
  >
    { Object.entries(languagesKey()).map(([key, value], index) => {
        if (key != this.state.nativeLanguage && key != 'bg') {
          const countryCode = key == 'ja' ? 'jp' : key,
                img = require(`../../assets/flags/flag-${countryCode.toUpperCase()}.png`),
                bgImgSrc = `url(${img})`;

          return (
            <MenuItem className="listItemFlag" key={ index } value={ key } style={{ backgroundImage: bgImgSrc }}>{ value }</MenuItem>
          )
        }
      })
    }
  </Select>
</FormControl>

处理程序

nativeLanguageChange = (e) => {
  this.setState({
    nativeLanguage: e.target.value,
    nativeLanguageDescription: languagesKey()[e.target.value]
  })
}

状态

this.state = {
  description:               null,
  language:                  '',
  langaugeDescription:       '',
  listName:                  null,
  listIdToDelete:            null,
  nativeLanguage:            '',
  nativeLanguageDescription: '',
  openModal:                 false,
  words:                     null
}