Question

我的ReactJs应用程序中有三个字段。 Quantity，UnitPrice＆amp; TotalNetPrice。当我们开始在TotalNetPrice字段中输入任何值时，我会尝试计算Quantity（unitPrice默认情况下已填充）{

所以，对于这个要求，我正在使用onKeyDown事件。但是我没有在TotalNetPrice字段中获得正确的结果。

请找到我用于计算TotalNetPrice

的函数

handleTotalPrice(e)
{   
    var charCode = (e.which) ? e.which : e.keyCode;
    if(charCode >= 48 && charCode <= 57)
    {
        const item = this.state.item;
        const quantity = parseInt(item. quantity); 
        const price = parseInt(item.unit_net_price);
        var netAmount=0;
        if(quantity && price){
            netAmount=parseInt(quantity*price);
        }
        else{
             netAmount=0;
        }
        this.state.item.net_amount=netAmount;
        this.setState({ item: item });
    }
}

在第一个onKeyDown事件quantity被视为null并且在第二个onKeyDown事件quantity期间考虑我们之前输入的第一个值。

我不确定为什么会这样。

请找到用于调用上述javascript函数的render()方法。

render()
{
    return ( <tr><td><input name="quantity" type="text"  maxLength="6" onKeyDown={this.handleTotalPrice} value={ this.state.item.quantity } /></td> )
}

Answer 1

使用onkeyup而不是onkeydown。

    render()
{
    return ( <tr><td><input name="quantity" type="text"  maxLength="6" onKeyUp={this.handleTotalPrice} value={ this.state.item.quantity } /></td> )
}

ReactJs中的JavaScript onKeyDown事件

1 个答案: