[Vue.js] a 태그에 href, @click 각각 사용시 Carousel 슬라이드 작동 문제

a 태그에 @click를 적용하여 Carousel을 사용한 페이지로 이동하였는데 Carousel 슬라이드가 작동하지 않는 문제가 생겼다. 해당 페이지의 주소창에서 엔터키를 치면 정상적으로 작동하는 것으로 보아  Carousel의 문제는 아닌 듯했다. 그래서 a 태그에 @click 대신 href에 해당 페이지의 라우터를 넣어주었다. 그랬더니 페이지 이동 즉시 Carousel의 슬라이드가 작동했다. Carousel은 아래의 부트스트랩을 사용했다.

https://getbootstrap.com/docs/5.3/components/carousel/

Carousel

 

변경한 코드 예시

<a
href="/dashboard"
>

 

변경 전 코드 예시(Carousel 슬라이드 작동하지 않음)

<a
@click="goToMenu('/dashboard')"
>