<Button size="long" fontsize="middle">
<a href={url}>{name}</a>
</Button>
기존에는 버튼 내에 a tag를 넣어서 이동시키는 방법을 썼다.
페이지이동은 a가 아니라 link로 해야한다고 알고있었는데
알고보니 외부링크는 a태그를 쓰더라!!
그렇다고 이미 button 컴포넌트를 만들었는데 똑~같이 a태그를 만드는 것도 좀 별로라고 생각했다.
그래서 버튼 내에 a태그를 위치시켰는데, 이게 버튼을 누르면 이동하는 게 아니라 글자를 눌러야 이동을 하게되는... 그런 사달이 났다.
그래서 아예 버튼에 온클릭 이벤트를 넣어줌!!
const handleOpenLink = url => {
window.open(url, '_blank');
};
<Button
size="long"
fontsize="middle"
onClick={() => handleOpenLink(url)}
>
{name}
</Button>
이제 아주 잘 동작한다.
아! 추가로 이번에는 클릭시 새로운 창이 뜨게 했다.