/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

-2 votes303 views1 answer
How to hide keyboard in react native
Javascript React
2 votes281 views4 answers
Can't perform a React state update on an unmounted component
Javascript React
0 vote278 views1 answer
Dropdown list value react fragment
Javascript React
4 votes269 views2 answers
React hooks useref is called in function which is neither a react function component
Javascript React
0 vote322 views1 answer
Unistall react node package
Javascript React
0 vote271 views3 answers
Set bg image in react
Javascript React
31 votes264 views1 answer
Download react router dom
Javascript React
1 vote285 views1 answer
Disable split screen react native
Javascript React
114 votes310 views3 answers
Run react app
Javascript React
0 vote275 views1 answer
Render first index active tabs in reactjs
Javascript React