调用多个函数onClick事件反应-反应日期拾取器 [英] Calling multiple functions onclick event Reactjs - react datepicker

问题描述

我需要在日历打开时灰显背景-单击，为此我正尝试编写一个js函数并调用它和实际的onClick处理程序一起调用-组合它。但它不起作用，我没有控制onClick处理程序，因为我使用的是Reaction包？如何处理这起案件？请帮帮忙...

class CustomDatePicker extends Component {

  handleOpacity(){
    // gray out the background page....
    alert('test');
  }

  click(){
    this.handleOpacity();
  }


  render () {
    return (
        <span>  
            <button className="custom-datepicker" onClick={this.props.onClick} >
             {this.props.value}
            </button>
        </span>
       )
    }
 }
CustomDatePicker.propTypes = {
  onClick: React.PropTypes.func,
  value: React.PropTypes.string
}

export default CustomDatePicker;

推荐答案

可以调用this.pros.onClick在this.Click方法内部。 您还应该在构造函数方法中绑定this.Click，因为您正在对Reaction组件使用ES2015类语法。

class CustomDatePicker extends Component {
  constructor() {
    this.click = this.click.bind(this)
  }

  handleOpacity(){
    // gray out the background page....
    alert('test');
  }

  click(){
    this.handleOpacity();
    this.props.onClick();
  }


  render () {
    return (
        <span>  
            <button className="custom-datepicker" onClick={this.click} >
             {this.props.value}
            </button>
        </span>
       )
    }
 }
CustomDatePicker.propTypes = {
  onClick: React.PropTypes.func,
  value: React.PropTypes.string
}

export default CustomDatePicker;

这篇关于调用多个函数onClick事件反应-反应日期拾取器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！