Javascript can'；t调用在组件内声明的函数

我在尝试调用组件内声明的函数时出错。以下是错误消息：UncaughtTypeError:无法读取未定义的属性'handleClick'

class LanguageDropDown extends Component {
  constructor(props) {
    super(props);

    this.state = {languageValue: ""};
    this.handleLanguageClick = this.handleLanguageClick.bind(this);
  }
  handleLanguageClick = (languageKey) => {
    this.setState({ languageValue: languageKey});
  }

  render() {
    const {intl, value, onChange, onFocus, onBlur, onClick} = this.props;
    return (
      <React.Fragment>
        {
          map(languageWhitelist, function(Key) {
            return (
              <option onClick={this.handleLanguageClick(Key)}
              key={Key} value={Key}></option>
             );
            }, this)
          }
      </React.Fragment>
    );
  }

}

class language下拉列表扩展组件{
建造师（道具）{
超级（道具）；
this.state={languageValue:“”}；
this.handleLanguageClick=this.handleLanguageClick.bind（this）；
}
handleLanguageClick=（语言键）=>{
this.setState（{languageValue:languageKey}）；
}
render（）{
const{intl，value，onChange，onFocus，onBlur，onClick}=this.props；
返回(
{
映射（语言白名单，函数（键）{
返回(
);
}，本页）
}
);
}
}

这应该行得通

class language下拉列表扩展组件{
状态={languageValue:''}；
_handleLanguageClick（语言值）{
this.setState（{languageValue}）；
};
render（）{
const{intl，value，onChange，onFocus，onBlur，onClick}=this.props；
返回(
{languageWhitelist.map（语言=>(
这个。_handlelanguage点击（语言）}
键={language}
>
{语言}
))}
);
}
}

通过在类中使用箭头函数，它会自动绑定到类， 因此，只需从构造函数中删除binding语句。 并将onClick道具设置为回调函数

class LanguageDropDown extends Component {
  constructor(props) {
    super(props);

    this.state = { languageValue: '' };
  }

  _handleLanguageClick = languageValue => {
    this.setState({ languageValue });
  };

  render() {
    const { intl, value, onChange, onFocus, onBlur, onClick } = this.props;

    return (
      <React.Fragment>
        {languageWhitelist.map(language => (
          <option
            onClick={() => this._handleLanguageClick(language)}
            key={language}
          >
            {language}
          </option>
        ))}
      </React.Fragment>
    );
  }
}

class language下拉列表扩展组件{
建造师（道具）{
超级（道具）；
this.state={languageValue:''}；
}
_handleLanguageClick=languageValue=>{
this.setState（{languageValue}）；
};
render（）{
const{intl，value，onChange，onFocus，onBlur，onClick}=this.props；
返回(
{languageWhitelist.map（语言=>(
这个。_handlelanguage点击（语言）}
键={language}
>
{语言}
))}
);
}
}

handleClick

，如错误消息中所述，不会出现在提供的代码段中。可能会检查其他组件，特别是那些使用

语言下拉列表作为内容的组件。可能会尝试此
此。handleLanguageClick（Key）}Key={Key}value={Key}>
谢谢您的帮助，错误不再出现，但是handleLanguageClick不运行对不起，您说的不运行是什么意思？它根本没有被调用，或者组件没有呈现？组件呈现良好，但事件没有被调用，_handleLanguageClick（languageValue）{this.setState（{languageValue}）；console.log（“test”）；}；我放了一些日志要检查，但我没有在控制台中得到任何东西。我编辑了一些代码，并在codesandbox中进行了验证。对我来说一切都很好，