我在React JS中上傳圖片時未觸發onChange

Question

我想在我將屬性發送到組件的react js中上傳圖像

<Input 
    changed={(event) => this.ChangedHandler(event)} 
    clicked={(event) => this.ClickedHandler(event)} 
 />

我正在從另一個功能組件中接收

const Input = (props) =>{
  return(
     <input
        onChange={props.changed} 
        onClick={props.clicked} 
    />
    <label>
        <input id="myFile" type="file"/>
        Upload File
    </label>
 )
}

當我在嘗試上載圖像時單擊Click時，onClick事件已正確觸發，但是選擇要上載onChange的文件應被觸發，但這不會發生。

Answer 1

在組件Input您沒有正確傳遞道具。 這就是您將要做的。

<Input 
   changed={(event) => { this.ChangedHandler(event) }} 
   clicked={(event) => { this.ClickedHandler(event) }} 
/>

在Input組件文件中，您將執行此操作。

const Input = (props) => {
  return(
    <input 
      type="file" 
      onChange={props.changed} 
      onClick={props.clicked} 
    >
      Upload
    </input>
   )
 }