Отображение нескольких изображений перед загрузкой в ​​React Js

Question

Я новичок в React.js и застрял в своем первом приложении.

Я пытаюсь отобразить несколько изображений, выбранных перед загрузкой.Код ниже отображает только одно изображение.

class ImageUpload extends Component 
{
    constructor(props)
    {
        super(props);
        this.state={
        image:null,
        url:[]
    }
        this.handleChange=this.handleChange.bind(this);
}

    //select an image
    handleChange =(e) =>{
        if(e.target.files[0]){
                const image = Array.from(e.target.files);
                this.setState(() => ({image}));
                const len = image.length;
                    for(let i=0;i<len;i++)
                    {
                        this.setState({
                        url: URL.createObjectURL(e.target.files[i])})
                    }

         }
    }

render() { 
    return ( 
            <div>
                <input type="file" onChange={this.handleChange} required multiple={true}/>
                <button onClick={this.handleUpload}>Upload</button>
                <img  src={this.state.url} width="200" height="200" alt=""/>
            </div>
            );
        }
}