상수집합 Constants.js

상수란 변하지 않는 값을 말한다. 항상 변하지 않는 고정 된 값이다.
API단에서 Enum 등을 정의 할 때 열거형 안에 사용하곤 하는데 Front에서도 미리 정의한 코드 정의서나 API가 넘겨줄 상수를 받아 사용하기 위해 정의한다.

Constants.js 되시겠다.

ROLE_TYPE: {
USER: 'ROLE_USER',
ADMIN: 'ROLE_ADMIN',
SYSTEM: 'ROLE_SYSTEM'
}

루트 디렉토리에 Constants.js 자바스크립트 파일을 만들고 위처럼 하나의 타입에 대한 상수들을 선언 해 준다.

이제 Constants.js에서 ROLE_TYPE을 꺼내면면 아래 3가지 값을 사용할 수 있다.

예로 로그인 한 회원의 Role에 따라 메뉴를 onOff 해야하는 경우라면

  methods: {
      isUser (role) {
      return Constants.ROLE_TYPE.USER === role
    },
     isAdmin (role) {
     return Constants.ROLE_TYPE.ADMIN === role
    },
  }

로그인 후 받아오는 Role을 Constansts.js에 정의한 값과 비교해 true/false 을 리턴받아

<li v-if="isUser">메뉴</li>

이런 형태로 사용할 수 도 있고, api를 호출할 떄 마다 같은 url에 RoleType으로 frefix를 선언 해 놓은 경우 각 유저의 권한에 따라 api를 호출하는 등 여러방면에서 사용할 수 있다.