React file upload jquery blueimpファイルアップロードプラグインを使用したコンポーネント

Question

私は反応が新しく、Reactでファイルアップロードコンポーネントを作成しようとしていました。しかし、ネイティブのReactプラグインを見つけることに失敗しました。だから私はReactコンポーネントからJQueryプラグイン（Blue-impファイルのアップロード）を呼び出そうとしましたが、私の問題はアップロードされたファイルが一度しか動作しないことです。 Blue-impプラグインはファイルを自動的にアップロードするように設定されており、ファイルアップロードコントロールは非表示になっており、そのクリックがトリガーされます。私のコードは以下の通りです：

var FileUpload = React.createClass({ 

    triggerUpload:function(){ 
    this.myFileInput.trigger('click'); 
    },  
    componentDidMount: function() { 
    this.myFileInput = $(ReactDOM.findDOMNode(this.refs.mu)); 
    this.myFileUpload = this.myFileInput.fileupload({ 
          dataType: this.props.dataType, 
          url: this.props.uploadURL, 
         }); 
    }, 
    render: function() { 
    return (
     <div className="myFP" onClick={this.triggerUpload}> 
      <input type="file" ref="mu" name="files[]" multiple="" className="hidden"/> 
     </div> 
    ); 
    } 
}); 

ReactDOM.render(<FileUpload dataType="json" uploadURL="/upload-file" />,$('#fpDiv').get(0)); 

React経由でjqueryプラグインを呼び出す正しい方法は誰にも教えてください。どんな助けでも大歓迎です。

Answer 1

<div className="myFP" onClick={this.triggerUpload.bind(this)}> 
      <input type="file" ref="mu" name="files[]" multiple="" onClick={this.testFnc.bind(this)} className="hidden"/> 
     </div> 

なぜ同じスコープで2つの方法があるのだろうと思います。メソッドtriggerUploadとtestFncは、クリック時に入力をトリガーにします。あなたはそれを管理する必要があります。