2017-04-09 11 views
2

ファイルをアップロードするときにファイルアップロードウィンドウを開くのを止めるにはどうすればよいですか?e.preventDefault()またはfalseを返すfalseを開くにはファイル入力を停止できませんでした

export default class Upload extends Component { 
    constructor(props) { 
     super(props); 

     this.state = { 
      filename: null, 
      isLoading: false 
     } 

    } 

    trigger_upload_input =() => { 
     document.getElementById("browse-file").click(); 
    } 

    handleOnChange = (e) => { 
     if(e.target.files[0]) { 
      this.setState({filename: e.target.files[0].name, isLoading: true}); 
      var that = this; 

      setTimeout(function(){ 
       that.setState({isLoading: false}) 
      },3000) 
     } 

    } 

    handleInputClicked = (e) => { 
     if(this.state.isLoading){ 
      e.preventDefault(); 
     } 
    } 

    render() { 
     const { isLoading } = this.state; 
     return(
      <div className="upload"> 
       <div> 
        <input onClick={this.handleInputClicked} onChange={this.handleOnChange} type="file" id="browse-file"/> 
        {this.state.filename && <span>{this.state.filename}</span>} 
       </div> 
      </div> 
     ) 
    } 
} 

負荷インジケータの仕事が、私は再び入力にe.preventDefaultを(クリックしてください)を開くために、ファイルのウィンドウを停止しない、それは問題を解決していませんreturn falseを試してみましたか?

答えて

0

e.stopPropagation()を試してみてください(event.stopPropagation())。

更新disabled属性などの

ルックスは、のonChangeハンドラを追加することができます。これによりダイアログが開かれなくなります。この属性は、読み込みが完了した後で削除することができます。

+0

同じ、動作しません。 –

+0

クリック可能にならないように入力に 'disabled'属性を追加するだけかもしれませんか? – ghostprgmr

関連する問題