/Javascript/React/Get image url in react input file or preview form image

Get image url in react input file or preview form image

getInitialState: function(){
  return{file: []}
}

_onChange: (event)=>{
    this.setState({
        imgs: event.target.files
    })
},

render: function(){
 return(
  <div>
    <form>
      <input 
        ref="file" 
        type="file" 
        name="user[image]" 
        multiple="true"
        onChange={this._onChange}/>
    </form>

    {/* Display all selected images. */}        
    {this.state.imgs && [...this.state.imgs].map((file)=>(
       <img src={URL.createObjectURL(file)} />
    ))}

  </div>
 )
}

Source: stackoverflow.com

Similar codes

1 vote237 views1 answer
React native basic template
Javascript React
1 vote247 views4 answers
Notification react native
Javascript React
21 votes172 views3 answers
Hide header bar react navigation
Javascript React
1 vote234 views3 answers
React native SafeAreaView
Javascript React
14 votes222 views2 answers
Border react native
Javascript React
1 vote249 views1 answer
How to create round image in react native
Javascript React
0 vote236 views1 answer
Install react hotjar
Javascript React
0 vote239 views1 answer
ReactRender
Javascript React
0 vote221 views1 answer
React s.a.createElement("div",{className:"d-none d-lg-flex flex-content"},s.a.createElement(u.a.Body,{noScroll:!0}
Javascript React
2 votes235 views3 answers
React cdn
Javascript React