Javascript 我怎样才能通过；onChange"；在不'；你不接受这些道具吗？

我使用中的代码是为了切换语言，但我尝试将其修改为使用材质UI组件进行样式设置。更改语言是可行的，但每次更改都会将我带回主页，因为我使用的

MenuList

组件不接受

onChange

道具，这与原始代码中的select不同

我的问题是：如何在这个第三方组件中传递

onChange

props

原始代码：

import React, { Component } from 'react'
import PropTypes from 'prop-types'

class Language extends Component {
  static contextTypes = {
    language: PropTypes.object,
  }

  state = {
    value: '',
  }

  componentDidMount() {
    const { language } = this.context
    this.setState({
      value: language.locale || language.detected,
    })
  }

  handleChange = event => {
    const { language } = this.context
    const { originalPath } = language
    const { value } = event.target

    if (value === this.state.value) {
      return
    }

    this.setState({ value }, () => {
      localStorage.setItem('language', value)
      window.location.href = `/${value}${originalPath}`
    })
  }

  render() {
    const { language } = this.context
    const { languages } = language
    const { value } = this.state

    if (!value) {
      return null
    }

    return (
      <select value={value} onChange={this.handleChange}>
        {languages.map(({ value, text }) => (
          <option key={value} value={value}>
            {text}
          </option>
        ))}
      </select>
    )
  }
}

export default Language

---

您可以签入codesandbox，这里的重要文件是src/component/language.js:

MenuItem有一个

onClick

prop。你可以用这个。单击事件处理程序可以如下所示：

handleClick = event => {
    const { value } = event.currentTarget;
};

---

你可以参考。

你甚至可以用那种方式？我要走了undefined@molusken给出一个演示链接。未定义的未来在哪里？？？@molusken我已经更新了答案。你能试试吗？@klvenky检查这里的代码沙盒language.js在src/components中

handleClick = event => {
    const { value } = event.currentTarget;
};