React - onChange事件在select2列表中未觸發

Question

我有一個附加到表中每個select元素的onChange事件的React組件。這些select元素也有select2的jquery庫來處理它們。無論出於何種原因，該事件不觸發（在控制檯中沒有錯誤其一）：

import select2 from 'meteor/natestrauser:select2'; 

export default class MyComponent extends React.Component { 

    constructor(props) { 
     super(props); 
    } 

    executeSelectedOption(e){ 
     console.log("Worked!"); 
    } 

    componentDidUpdate(){ 
     $("select.js-example-placeholder-single").select2({ 
      minimumResultsForSearch: Infinity 
     }); 
    } 

    render() { 
    var results = this.props.data; 
    return (
     <div> 
      <table> 
       <thead> 
        <tr> 
         <th>Title</th> 
         <th></th> 
        </tr> 
       </thead> 
       <tbody> 
        {results.map(function(d, index) { 
         return (
          <tr key={d._id}> 
           <td>{d.title}</td> 
            <td> 
             <select onChange={this.executeSelectedOption.bind(this)} className="js-example-placeholder-single"> 
              <option value="">...</option> 
              <option value="1">Do this</option> 
              <option value="2">Do that</option> 
             </select> 
            </td> 
           </tr> 
          ) 
         }, this)} 
        </tbody> 
       </table> 
      </div> 
     ); 
    } 
} 

Answer 1

我發現，使用選擇二以下NPM包裝提供了一個直接的解決方法。

https://github.com/rkit/react-select2-wrapper