vue router query로 조건문

선디·2021년 4월 24일
0

vue router에 쿼리문에 따라 조건이 노출될 수 있도록 해주는 구문입니다.

<li><router-link to="markup/main?app=true">단독앱 메인</router-link></li>

쿼리로 넘긴 데이터는 this.$route.query.app 이렇게 받을 수 있다.

쿼리로 조건을 사용하여 UI노출시키는 경우
해당 컴포넌트 created라이프 사이클을 사용하여 state를 업데이트한다.

data() {
    this.isApp = false;
},
created() {
    this.isApp = this.$route.query.app;
}

조건문으로 UI를 노출 비노출한다.

<header-app v-if="isApp"></header-app>

0개의 댓글