的onsubmit綁定不起作用

我要上傳文件，我的代碼工作在一箇舊的項目，但它的，也沒辦法！的onsubmit綁定不起作用

class JsonUploader extends React.Component{ 

constructor(props){ 
    super(props); 

    this.state = {file: ''}; 
    this.handleChange = this.handleChange.bind(this); 
    this.handleSubmit = this.handleSubmit.bind(this); 


} 


handleChange(event){ 
    this.setState({file: event.target.files[0]}); 
} 

handleSubmit(event){ 
    let data = new FormData(); 
    data.append('file', this.state.file); 
    data.append('name', this.state.file.filename); 
    axios.post("/files", data).then((response) => {console.log(response.data)}).catch(console.log("Sending failed")); 
} 

render(){ 
    return(
     <form onSubmit={this.handleSubmit}> 
      <input type="file" name="file" onChange={(event) => {this.handleChange(event)}}/> 
     <br/> 
      <input type="submit" value="submit"/> 
     </form> 
    ); 
}

}

有我的課。正如你所看到的，處理程序是綁定的。我不知道爲什麼沒有傳中的第一或第二處理......我嘗試了兩種方式（箭頭和經典使用），但同樣的結果..

我反應過來的應用程序是一個服務器端渲染應用程序，我不知道如果它改變的東西..

感謝您的幫助！

來源

2017-04-21 Psyycker

對於一個你應該只需要'的onChange = {this.handleChange}'。二，你可能需要''handleSubmit'函數中的'event.preventDefault（）'，因爲當你想要一個AJAX請求時，它會試圖發送表單到服務器。 –

我已經把console.log放在處理程序的開始處，並且沒有任何東西在那裏傳遞，所以如果我的函數沒有被訪問，event.preventDefault（）是沒用的 – Psyycker

你能把它移動到一個bin嗎？我試了一下，似乎一切正常。 –

好吧，我發現這個問題，並could'nt工作，我給了回購。事實上，我忘記了在我的index.html中添加client.js文件。

來源

2017-04-24 11:47:27 Psyycker

的onsubmit綁定不起作用

回答

相關問題