React component doesnt reload img

I try to create upload component and UploadComponentWithPreview to show image I have uploaded. The images are stored in AWS and after upload I get a response from service with url image url. Problem is the url is still the same and browser is probably doing some caching so after upload I cant see the new one. I have tried some approaches like "cache breaking" (added fake params to url like '{url}?t={id}') and setting state to '' and back to url to force component rerender but either of them dont work. What I can try is to use embeded image instead of url but I'm not sure this one is good way to fix it (even if it probably gonna work). Do you please have any idea how to fix it or why cache breaking doesnt work ? Thank you

setLoading = (url) => {
    console.log('OnBeforeUpload');
    this.setState({pictureUrl: ''});
}

setImage = (url) => {
    console.log('OnUploadSuccess');
    this.setState({pictureUrl: url});
}

render() { 
    const fileKey = this.uploadService.generateFileKey(this.props.code, this.props.pictureRole)
    return (  
        <div className="card">
            <div className="card-header">
                {this.props.title}
                <ImgUploadInput name={this.props.name} 
                                autoUpload={true} 
                                fileKey={fileKey} 
                                pictureRole={this.props.pictureRole} 
                                onChange={(data) => console.log('OnChange: ', data)}
                                onBeforeUpload={(data) => this.setLoading()}
                                onUploadSuccess={(url) => this.setImage(url)}
                ></ImgUploadInput>
            </div>
            <div className="card body">
                {this.state.pictureUrl ? <img style= src={this.state.pictureUrl} alt={this.props.pictureRole} /> : <span>Loading ... </span>}
            </div>
        </div>
    );
}