vue nuxt default layout 화면에 맞게 커스터마이징하기

vue nuxt 에서 layout 을 custom 하게 작성하는법

 

vue nuxt 의 /layout/default.vue 에 정의되는 내용대로 default layout 이 지정된다.

이때, default layout 이외의 다른 layout 을 사용해야하는 경우나 header 가 없는 페이지를 작성해야하는 경우가 있다.

1. layout 아래에 custom layout 생성
   ex) /layout/login.vue 생성
2.  실제 화면에서 layout 을 프로퍼티로 정의
   /pages/login/login.vue에서 

<script>
export default {
  name: 'survey-form',
  layout: 'survey',
  ...
};
</script>