/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

0 vote180 views1 answer
React router redirect with query params
Javascript React
0 vote140 views1 answer
React Hook useEffect has missing dependencies: 'cart' and 'user._id'. Either include them or remove the dependency array react-hooks/exhaustive-deps
Javascript React
0 vote135 views1 answer
React-metismenu-router-link
Javascript React
0 vote142 views1 answer
Configure the Chrome debugger react
Javascript React
-2 votes128 views2 answers
Import link react
Javascript React
1 vote149 views2 answers
Autofocus react
Javascript React
127 votes264 views3 answers
Make react app
Javascript React
14 votes124 views2 answers
Adding border in react native
Javascript React
0 vote137 views1 answer
Eslint init settings for ReactJS
Javascript React
0 vote138 views1 answer
Fetchutils in react admin
Javascript React