[Vue.js] 전역으로 선언 된 것 거꾸로 찾아가는 법...엥?
2022. 7. 5. 17:18ㆍFront-end
반응형
쿠폰 번호를 누르면 쿠폰 상세보기 모달창이 뜨는 기능을 추가했다.
그런데 모달창 옆에 사이드메뉴가 달려있다...난 이런 거 만든적이 없는데?
심지어 다른 모달창에는 사이드메뉴가 없이 모달창만 깔꼼하게 뜨는데...
프로젝트 중간에 투입한 상황에서, 그 기능이 어디에 만들어져있는지 모를 때 이렇게 찾아가면 된다.
1. 사이드메뉴가 내가 설정을 해놓지도 않았는데 저절로 달려있다라... 그럼 뭐다? 전역이다!
2. vue에서 전역은 두군데를 보면된다. 어디?
- App.vue
- main.js
이 두군데!!!
3. App.vue, main.js를 들어가서 import를 보면서 의심스러운 곳을 타고타고 들어가면 된다.
이렇게 해서 오게 된 layout>index.vue 파일에서
<sidebar v-if="showSideMenu" class="sidebar-container"/>
showSideMenu가 의심스럽군...컨트롤 누르면서 클릭! 따라가보자!
showSideMenu() {
return this.needTagsView && !this.isHide
},
is.Hide 따라가보자!
isHide() {
return this.sideHideMenuList.filter(menu => this.$route.name === menu).length > 0
}
sideHideMenuList !
sideHideMenuList: [
'customer/active/detail',
'customer/inactive/detail',
'customer/withdrawal/detail',
'order/history/detail',
]
찾았다 요녀석! 여기에 안뜨게 할 route의 name만 추가해주면 되겠군!
router에 가서 name을 보자!
{
path: '/coupon/use/:customerOrderNo/:ecpnNo',
component: () => import('@/views/contents/ecoupon/use/useCouponCodeDetail'),
name: 'coupon/use/couponCodeDetail',
hidden: true,
meta: { title: 'couponCodeDetail', noCache: true, activeMenu: 'coupon/use' }
}
'coupon/use/couponCodeDetail' 을 확인! 추가해주자~!
sideHideMenuList: [
'customer/active/detail',
'customer/inactive/detail',
'customer/withdrawal/detail',
'order/history/detail',
'coupon/use/couponCodeDetail'
]
성공!
모달창에 사이드메뉴가 안뜨고 깔꼼하게 모달창만 떴다!
반응형
'Front-end' 카테고리의 다른 글
[WebStorm] npm install error (0) | 2022.07.12 |
---|---|
[Vue.js] npm... 너란녀석을 어떻게 한담... (0) | 2022.07.06 |
모달창 입력값 초기화 | vue.js (0) | 2022.06.08 |
[vue.js] v-if, v-else로 글씨바꾸기 (0) | 2022.06.03 |
JQuery+Ajax의 조합을 연습하자! 기본부터 (0) | 2021.12.30 |