Как правильно прописать типы в Vue3?

Question

[uRoot]

После Реакта сильно непривычно прописывать типы для пропсов в Vue 3. В доке есть несколько вариантов. Какой лучше юзать не понятно, какой юзается в проде мне тоже не известно. Подскажите плиз как правильно указать интерфейс IArticle, который я экспортирую выше, для пропсов, чтобы это не нарушало принципы Vue 3. В Реакте я бы просто сделал так: setup(props: IArticle), но здесь так нельзя, как я понял.

<script lang="ts">
// Vendors
import { toRefs } from "vue";


export default {
  name: 'Post',
  
  setup(props) {
    const { text, image, date } = toRefs(props)

    ...

    return {
      getDate,
      getDescription,
      getImageLink
    }
  }
}
</script>

Comments

[Александр]

import { defineComponent, toRefs } from 'vue'

export default defineComponent({
  name: 'Post',
  props: ['text', 'image', 'date'],
  setup(props) {
    // ...
  }
})

[uRoot]

Александр, а я могу как в Реакте прописывать типы данных для пропсов? Ну и чтобы это не нарушало паттерны Vue.

Я пробую так

Но если я удалю вот это:

props: {
    title: String,
    text: String,
    id: String,
    image: String,
    date: String,
    category: String
  },

То я вижу ошибку и компонент падает.

[Александр Медведев]

uRoot, в документации написано же