如何在反应中获取列的值

Question

我有这样的表列，它的值来自我的减速器。同一列有递增/递减按钮。因此，当使用单击按钮时，我必须从该 <td> 中获取价值并触发我的操作。我正在搜索here，但它用于搜索具有事件onChange 的输入文本。请任何人告诉我如何做到这一点？

这是我的<td> 专栏：

<td>
    {this.props.prog}%
    <button type="button" className="btn btn-danger">
        <span className="glyphicon glyphicon-arrow-up" />
    </button>
    <button type="button" className="btn btn-danger">
        <span className="glyphicon glyphicon-arrow-down" />
    </button>
</td>

编辑 1：

我已经尝试了一些基本上我的 onClick 正确触发但我无法传递值

<td>
                        <button type="button" className="btn btn-danger" onClick={this.props.resetGrowth}>Reset</button>
                        {this.props.prog}%
                        <button type="button" className="btn btn-danger" onClick = {(event) => this.props.updated(this.props.prog) }>
                        <span className="glyphicon glyphicon-arrow-up"/>
                        </button>
                        <button type="button" className="btn btn-danger">
                        <span className="glyphicon glyphicon-arrow-down"/>
                        </button>
                    </td>

它会将这个组件传递给它

<Table updated={value => this.props.udated(value)}/>

这是我的容器，它触发了价值

 <VolumeComponent 
              udated = {(value) => updated(value)}/>

const mapDispatchToProps= (dispatch) => (
 bindActionCreators({updated},dispatch)
)

Answer 1

由于您使用的是 reducer，我猜您使用的是 redux。如果{this.props.prog} 是您的值，您可以在传递给增加/减少按钮的 OnClick 函数中使用它。例如：

handleDecrease(){
    const newValue = this.props.prog + 1;
    this.props.updateValue(newValue)
}

handleIncrease(){
    const newValue = this.props.prog - 1;
    this.props.updateValue(newValue)
}

render(){
    return (
        ...
        <button onClick={this.handleIncrease}/>
    );
}