How to make Material UI icon to act like anchor tag?

Question

I have this Icon from material UI, I wish to make it clickable and open a new window to www.linkedin.com

should I use href="Linkedin.com" ? or add onClick ? I wish it to open a new tab/window aswell

Answer 1

This should do using Material-UI Icons:

import LinkedInIcon from '@material-ui/icons/LinkedIn';
import IconButton from '@material-ui/core/IconButton';

<IconButton aria-label="Linkedin.com" onClick={() => window.open('https://www.Linkedin.com')}>
  <LinkedInIcon fontSize="large" />
</IconButton>

To open a new page:

onClick={() => window.open(newPageUrl, "_blank")}

To open on the same one:

onClick={() => window.location.replace(newPageUrl)}

CodeSandBox

Answer 2

there is two way which can help you

1. you can use tag insert icon into tag and give href="(URL)" as an attribute into tag
2. you can also use JavaScript onclick function like example below https://www.Linkedin.com=' + this.selectedIndex;"" >