Javascript 如何在React中触发onBlur事件?

Javascript 如何在React中触发onBlur事件?,javascript,function,reactjs,onblur,Javascript,Function,Reactjs,Onblur,我有一个输入字段值,我想将其格式化为onBlur,下面是我的代码: 组件: <Input onBlur={this.formatEndpoint} /> formatEndpoint() { let endpoint = this.state.inputEndpoint; endpoint = endpoint.replace(/\s/g, '').replace(/\/+$/, ''); if (endpoint.slice(-1)

我有一个输入字段值,我想将其格式化为onBlur,下面是我的代码:

组件

  <Input
    onBlur={this.formatEndpoint}
  />
  formatEndpoint() {
    let endpoint = this.state.inputEndpoint;

    endpoint = endpoint.replace(/\s/g, '').replace(/\/+$/, '');

    if (endpoint.slice(-1) === '/') {
      endpoint = endpoint.substring(0, endpoint.length - 1);
    }

    console.log('anything');
  }

为什么连
console.log()
onBlur都不能工作?谢谢。

多亏了这些评论,我才弄明白。我不得不在
Input
中添加一个
onBlur
道具,如下所示:

export default class Input extends React.Component {
  constructor() {
    super();
    this.handleBlur = this.handleBlur.bind(this);
  }

  handleBlur() {
    const { onBlur } = this.props;
    onBlur();
  }

  render() {
    return <input onBlur={this.handleBlur} />
  }
}

Input.propTypes = {
  onBlur: PropTypes.func,
};

Input.defaultProps = {
  onBlur: () => {},
};
导出默认类输入扩展React.Component{
构造函数(){
超级();
this.handleBlur=this.handleBlur.bind(this);
}
车把{
const{onBlur}=this.props;
onBlur();
}
render(){
返回
}
}
Input.propTypes={
onBlur:PropTypes.func,
};
Input.defaultProps={
onBlur:()=>{},
};

经过大量的搜索,我用下面的代码做到了这一点, 在我的例子中,我使用的是React CS6

class test extends React.Component {
  onBlur() {
    console.log('anything');
  }


   render () {
      let { onBlur, onChange, value, ...props } = this.props;

      return (
        <input onBlur={ this.onBlur }  />
      );
  }

}
类测试扩展了React.Component{
onBlur(){
console.log(“任何东西”);
}
渲染(){
让{onBlur,onChange,value,…props}=this.props;
返回(
);
}
}

看起来像是自定义的
输入。您应该检查组件是否支持
onBlur
。是的,
Input
的定义是什么样的?是你写的吗?这些评论很有帮助,我只需要在
输入中添加一个onBlur道具。