nuxt logo

ドキュメント翻訳(非公式)

defineNuxtComponent

defineNuxtComponent() は、Options API を使用して型安全なコンポーネントを定義するためのヘルパー関数です。

defineNuxtComponent() は、defineComponent() に似た Options API を使用して型安全な Vue コンポーネントを定義するためのヘルパー関数です。defineNuxtComponent() ラッパーは、asyncData および head コンポーネントオプションのサポートも追加します。

Nuxt で Vue コンポーネントを宣言するには、<script setup lang="ts"> を使用することが推奨されています。

こちらも参照 getting-started > data-fetching

asyncData()

アプリで setup() を使用しない場合、コンポーネント定義内で asyncData() メソッドを使用できます:

pages/index.vue
export default defineNuxtComponent({
  async asyncData() {
    return {
      data: {
        greetings: 'hello world!'
      }
    }
  },
})

アプリで setup() を使用しない場合、コンポーネント定義内で head() メソッドを使用できます:

pages/index.vue
export default defineNuxtComponent({
  head(nuxtApp) {
    return {
      title: 'My site'
    }
  },
})