Vue Router 와 Href 속성

Bootstrap-Vue 사용시 주어지던 href 속성에서 일어나는 Vuex 관련 문제이다.

 

앞으로 더 공부해야할 부분이다.

 

Vuex 사용시 Store 에 들어간 자원은 공통 데이터인데 이는 Actions -> Mutations -> State 에 의해 변화되는 단방향 데이터 흐름을 가진다.

 

BootStrap-Vue 에서 주어지는 href 속성을 사용할 시에 페이지가 새로고침 되어 기존에 있던 Store 정보가 모두 날아간다.

---

 

날아가던 코드, href 속성으로 경로지정시 페이지가 새로고침된다.

<b-navbar-brand href="/">Dev</b-navbar-brand>

 

SPA 에서는 Router 를 이용한 페이지 이동이 전제 되므로 , 이 경우 Vuex 에 들어간 Store 정보가 날아간다.

 

 

 

---

밑은 이를 어찌저찌 해결해보려고 집어넣은 router-link 태그 사용 이다.

<b-navbar-brand >
	<router-link class="nav-router-link text-light" to="/">Dev</router-link>
</b-navbar-brand>

 

서비스나, 메서드 사용시 Vue Router 를 이용해서 움직여야한다는 것을 잊어서는 안된다.

 

조만간에, SPA Router 관련 공부를 시작해야겠다.