React JS：onChange内のイベントを渡す（Ant Design）

Question

私は自分のフォーム（https://ant.design/components/select）にドロップダウンを持っています。このselectドロップダウンでは、関数を呼び出すonChangeがあります。内部で 'onChange'私は自分の関数にパラメータとしてイベントを渡したいと思います。問題は、onChangeが発生したときに選択された値だけが渡されますが、私はイベント全体を必要とします。

export default class MyForm extends Component { 
    constructor() { 
     super(); 

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

    handleOnChange = (event) => { 
     console.log(event); // here I'm receiving only the value selected (1 or 2) 
    } 

    render() { 
     render(
      <Form> 
       <Select onChange={this.handleOnChange}> 

         <Option value="1">text 1</Option> 
         <Option value="2">text 2</Option> 
       </Select> 
      </Form> 
     ) 
    } 
} 

はconsole.logで

（）私が唯一の選択された値を受けています：ここで

はコードです。イベントオブジェクト全体を関数handleOnChange（）に渡す方法はありますか？

Answer 1

私は解決策を見つけました。 onSelect（）を使用して、値とイベントを渡します。

handleOnChange = (value, event) => { 
     ...code here   
} 

    render() { 
     render(
      <Form> 
       <Select onSelect={(value, event) => this.handleOnChange(value, event)}> 

         <Option value="1">text 1</Option> 
         <Option value="2">text 2</Option> 
       </Select> 
      </Form> 
     ) 
    } 

Answer 2

Selectコンポーネントは、onChangeを処理し、「外側」機能を呼び出すコンポーネントです。あなたが試すことができますどのような

はそれがうまくいくかもしれない、あなたの関数内で合成イベント変数を使用している：

handleOnChange = (selectedValue) => { 
    console.log(selectedValue); // The value from the inner component 
    console.log(event); // usually you have access to this variable 
}