ReactJs中的JavaScript onKeyDown事件

Question

我的ReactJs应用程序中有三个字段。 Quantity，UnitPrice和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> )
}