如何只为一个输入设置onclick方法?

时间:2017-08-18 14:27:13

标签: reactjs input onclick onchange setstate

首先请click获取SS。

现在我有2个输入值credit-cardpaypal

我为CreditCard设置了onClick事件以提供卡片信息。它工作正常,但问题是:

当我点击paypal输入时,卡片详情不会消失。它只是在我再次单击CreditCart输入时有效。我想让它消失,即使我点击paypal输入。我的意思是卡片的详细信息应该只需点击信用卡输入即可。

class CreditCart extends React.Component {
constructor(props) {
    super(props);
    this.state = {show:false};

    this.handleClick = this.handleClick.bind(this);
}
 handleClick () {
    this.setState({ show : !this.state.show})


}
   render () {
    return (
     //2 input here credir-cart has onClick


       {this.state.show && <CreditCart/>


  }

包含购物车信息部分的第二个组件:

class CreditCart extends React.Component {
constructor(props) {
    super(props);
}
render () {
// information part
}

2 个答案:

答案 0 :(得分:0)

您的function OnEdit() { var a=1; var ss = SpreadsheetApp.getActiveSpreadsheet(); while ( a<200 ){ if ( ss.getSheetByName('Active Jobs').getRange(a,12) == "On hold (i)" ) { ss.getSheetByName('Active Jobs').getRange(a,15).setValues("TBC"); a=a+1; } } } 方法错误。 handleClick方法是异步的,它会尝试批量执行它,这意味着之前的值可能还没有更新。

将其更改为

setState

请参阅State Updates May Be Asynchronous

答案 1 :(得分:0)

我认为以下内容对你有用......

class SomeComponent extends Component {
    constructor() {
        this.state = {
            toggle: false
        };
    }

    render() {
        return (
            <div>
                {this.state.toggle
                    ? <CreditCardComponent />
                    : <PaypalComponent />}
                <button
                    onClick={e => this.setState({ toggle: !this.state.toggle })}
                >
                    Toggle
                </button>
            </div>
        );
    }
}