Javascript 反应材料选择在选择后不显示值

我期待着完成一个语言软件，我的工作。不幸的是，我一直在使用react material ui select组件时遇到问题。总的来说，我似乎无法让他们工作。在下面的示例中，所选值未显示在UI中

JSX

陈述

---

另外，我注销了状态，并且它正在正确更新。

MenuItem

值是

键

，这是故意的吗？只是为了澄清一下，只有nativeLanguageDescription不适用，对吗？是的，正确，所以键实际上是一个语言代码，我使用它来发出API请求。用户界面显示使用语言代码显示语言描述，这是人类阅读的版本，因此英语变成英语等。。。对只是nativeLanguageDescription没有出现，因此即使状态更新，select仍保持为空…

值（即：

nativeLanguageDescription

）必须与项值匹配，但项值是键，我想您需要将

select

值更改为

this.state。国家语言

<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
}