Reactjs onChange不起作用

我想構建一個組件，用戶可以在其中上載圖像並在其上載之前顯示圖像。該文件的輸入字段是隱藏的，而用戶可以在其中顯示一個div，並在輸入字段中觸發點擊事件，以便用戶插入圖像。Reactjs onChange不起作用

這一切工作正常，但當用戶插入圖像時，onChange()不會被解僱。我究竟做錯了什麼？

export default class CreateArticlePublish extends React.Component { 
    insertImage =() => { 
     article_image: this.refs.article_image.click(); 
    } 
    displayImage = (event) => { 
     imagePlaceholder: this.refs.imagePlaceholder; 
     var url = URL.createObjectURL(event.target.files[0]); 
     imagePlaceholder.style.backgroundImage = "url(" + url + ")"; 
    } 
    render() { 
     return(
      <div> 
       <div id="publish-metadata"> 
        <form> 
         <label for="article_image">Image for the article</label> 
         <input type="file" name="pic" id="article_image" ref= "article_image" accept="image/*" /> 
         <div id="image_placeholder" onClick={this.insertImage} onChange={this.displayImage} ref="imagePlaceholder"> 
          <p>Click here to add an image</p> 
         </div> 
        </form> 
       </div> 
      </div> 
     ); 
    } 
}

來源

2016-07-11 Robin

的onChange也許應該是？ – Mary

@瑪麗是的。就是這樣。我沒有注意過。謝謝。 – Robin

@mary應該爲此發佈一個答案，以便知更鳥可以接受它 – Dave

連接的onChange輸入，而不是底層的div

來源

2016-07-11 08:02:30

Reactjs onChange不起作用

回答

相關問題