\n```\n\n**default export:**\n```typescript\nexport default {\n name: \"MyComponent\",\n inheritAttrs: false,\n setup() {\n const count = ref(0)\n return { count }\n }\n}\n```\n\n**Benefits of defineOptions:**\n- Works with script setup.\n- Less boilerplate.\n- Better TypeScript."}}]}

Vue.js: What is the difference between defineOptions and default export in Vue 3?

117

🟢Vue.js⚡ middle

What is the difference between defineOptions and default export in Vue 3?

defineOptions — declare options in script setup. default export — Options API.

defineOptions:

vue

1<script setup lang="ts">
2defineOptions({
3    name: "MyComponent",
4    inheritAttrs: false
5})
6
7const count = ref(0)
8</script>

default export:

typescript

1export default {
2    name: "MyComponent",
3    inheritAttrs: false,
4    setup() {
5        const count = ref(0)
6        return { count }
7    }
8}

Benefits of defineOptions:

Works with script setup.
Less boilerplate.
Better TypeScript.

Больше вопросов по Vue.js

What is the difference between shallowRef and ref with triggerRef?What is the difference between onBeforeMount and onMounted in Vue?

Назад к категории Vue.js