反応ブートストラップでonChangeを使用できませんToggleButtonGroup

Question

この問題を発見してから毎分怪奇になりました。主な問題は、onChangeイベントをToggleButtonGroup上で動作させることができないことです。

マイコード：

今

class ToggleButtonGroupControlled extends React.Component {                                 
    constructor(props, context) {                                  
     super(props, context);                                   

     this.state = {                                     
      value: [1, 3],                                    
     }; 

     this.onChange = this.onChange.bind(this);                                  
    }                                         

    onChange(value){                                     
     alert(value);                                     
     this.setState({ value });                                  
    };                                         

    render() {                                       
     return (                                      
      <ToggleButtonGroup                                   
       type="checkbox"                                   
       value={this.state.value}                                 
       onChange={this.onChange}                                 
       >                                      
       <ToggleButton value={1}>Checkbox 1 (pre-checked)</ToggleButton>                       
       <ToggleButton value={2}>Checkbox 2</ToggleButton>                          
       <ToggleButton value={3}>Checkbox 3 (pre-checked)</ToggleButton>                       
      </ToggleButtonGroup>                                  
     );                                        
    }                                         
} 

、私は別の「チェックボックス」を選択すると表示がそれに応じて変更されますが、アラートは解雇されることはありません。さらに、Chrome React拡張を介してコンポーネントを調べると、状態は変化しないので、onChangeハンドラは決して実行されないため、制御されていないコンポーネントとして残されています。

ただし、この同じコードはdocs demoで使用されていて、うまく動作します。別の奇妙なことに、デモでは、私は私のテストではできませんが、React Developer Toolsで$r.props.onChangeを使ってonChangeハンドラを変更することができます。 ToggleButtonGroupは、uncontrollableを使用して、を制御していないのバージョンのコンポーネントをラップして返します。制御されていないラッパーには、onChange Iが小道具を介して渡されますが、制御されたコンポーネントには、uncontrollableという特定のsetAndNotify関数があり、削除することはできません。

賢明な可能性をすべて捨ててしまったと思うので、本当に何が問題なのか分かりませんが、明らかに何かが欠けている可能性があります。

お時間をいただきありがとうございます。

Answer 1

他の人もこの問題に遭遇します（thisを参照）。ダウングレードreact-boostrapパッケージのバージョンは正常に動作するはずです