73 router-link active class, active 방법에 관한 고찰..?

source: categories/study/vue-experiance/vue-experiance_9-73.md

문제 1.

  • Part ( part/:id )
    • SettingView ( setting )
    • SearchList ( setting/management )
    • SearchOne ( setting/management/:vehicleSeq )
    • CreateEach ( setting/createEach )
    • CreateBundle ( setting/createBundle )
    • PartTransportModify ( setting/modify/:vehicleSeq )
  • Path 를 위와 같이 설정해야하는 이유
    • 그래야 "설정" 탭 메뉴에 _on class가 추가된다 ( /setting 이라는 주소가 겹치니까 )
    • "설정" 탭메뉴가 SettingView 컴포넌트를 불러오는 텝메뉴이다.

그런데 UI 구조상으로는 위의 SearchList나, SearchOne.. 등등이 SettingView 컴포넌트 안에 router-view에 나타나는 컴포넌트들이 아니다.
구조상으론 Part 컴포넌트의 router-view에 나타나는 애들이다.
즉, 그런 구조이기 때문에 SettingView 라우터의 children으로 설정할 수가 없다.
위와 같이 Part의 children으로 두어야 Part 컴포넌트의 router-view 태그로 잘 나타난다.

— 하지만 위와 같이하면 뭔가 코드를 꼴보기싫다.
Path를 보면 SearchList, SearchOne, .. 등등이 SettingView의 children 같은데.. 실제 UI 구조는 SettingView의 children이 아닌 Part의 children이고..
Path와 UI 구조가 일치하지 않는 면에서 꼴보기가 싫다. 흠..

위의 SearchList, SearchOne.. 등의 라우터의 path에서 setting/ 을 빼버리고, 해당 라우터를 불러왔을 때, "설정" 탭 메뉴를 활성화시킬 수 있는 방법은 없을까?