Download file by clicking a button in ReactJS

Question

I have a website built with ReactJS and there are some files (PDF,DOC etc) that I want to let visitors download.

But simple href tag doesn't start the download, instead refresh the page.

<Button
          href="src/assets/files/exampleDoc.pdf"
          color="transparent"
          target="_blank"
          className={classes.navLink}
>

1. Why the href tag doesn't work in reactJS to download files?
2. How to download files with ReactJs using buttons?

Answer 1

The following approach worked for me.

import ExampleDoc from '......src/assets/files/exampleDoc.pdf'

<a href={ExampleDoc} download="MyExampleDoc" target='_blank'>
   <Button className={classes.navLink}>My Example Doc</Button>
</a>