/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

7 votes227 views1 answer
React Hook "React.useState" is called in function "placeItem" which is neither a React function component or a custom React Hook function react-hooks/rules-of-hooks
Javascript React
0 vote220 views1 answer
React native notify user for new version of app
Javascript React
1 vote210 views2 answers
How to navigate with navintems for react-bootstrap without refreshing the whole page
Javascript React
0 vote199 views1 answer
React-file-base64
Javascript React
0 vote227 views1 answer
React native text area form
Javascript React
1 vote201 views1 answer
Firebase react router page not found on page refresh
Javascript React
6 votes244 views3 answers
Apply required attribute on input using ternary operator using react js
Javascript React
1 vote225 views1 answer
Fontawsome icon size react element
Javascript React
0 vote210 views1 answer
TextField input font color React Material UI
Javascript React
0 vote215 views1 answer
Reactjs fix ios apostrophe encoding
Javascript React