/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

6 votes127 views4 answers
Autocomplete react vscode
Javascript React
0 vote118 views1 answer
How do you iterate through a list in react stackoverflow
Javascript React
7 votes120 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 vote117 views1 answer
Run react android
Javascript React
8 votes117 views2 answers
React native italic text
Javascript React
0 vote125 views2 answers
Veu js vs angular vs react features
Javascript React
0 vote121 views1 answer
React Native Text style example
Javascript React
65 votes110 views6 answers
Route react
Javascript React
1 vote129 views1 answer
React-native razorpay
Javascript React
0 vote117 views1 answer
Check scroll top height in react js
Javascript React