[Nuxt3] Props 선언 및 사용

1.  (구)Nuxt 2 Props 선언

  props: {
    title: {
      type: String,
      default: '',
    },
    seq: {
      type: Number,
      default: 1,
    },
  },

2. Nuxt3 Props 선언

title 뒤에 ? 가 붙어있는 것을 볼 수 있다.

?가 있을 경우 undefined도 할당할 수 있고, 

?가 없을 경우 오직 string만 가능하다.

interface Props {
  title?: string;
  seq?: number;
}
defineProps<Props>();

 

3. default값 설정

interface Props {
  title: string;
  seq: number;
}
withDefaults(defineProps<Props>(), {
  title: '',
  seq: 1,
});