首页 > 解决方案 > 事件没有在 bootstrap-react 组件的 onChange 道具上传递吗?

问题描述

在我的一个课程中,我有这个函数可以处理 React-bootstrap 单选按钮组的更改:

handleChange(value){
  this.setState({ value: value })
}

这有效,但我不明白为什么。直接传递值而不是事件。在我的理解中,处理事件的函数应该接受事件作为参数并访问调用我应该使用的函数的元素的值:event.state.value

但是当我通过 event 和 use 时event.state.value,我收到一条错误消息:

无法读取未定义的值

这是我的渲染功能:

  render(){
    return(
      <React.Fragment>
        <ToggleButtonGroup type="radio" name="options" value={this.state.value} onChange={this.handleChange}>
          <ToggleButton value={1} variant="outline-dark">Option 1</ToggleButton>
          <ToggleButton value={2} variant="outline-dark">Option 2</ToggleButton>
          <ToggleButton value={3} variant="outline-dark">Option 3</ToggleButton>
        </ToggleButtonGroup>
      </React.Fragment>
    );
  }

有人可以解释为什么我的代码会这样吗?

顺便说一句,我使用 CDN not 安装了 react 和 react-bootstrap npm

标签: reactjsreact-bootstrap

解决方案


在 React Bootstrap 中,ToggleButtonGroup将值直接传递给更改处理程序。请参阅此处的文档。


推荐阅读