Vue でデフォルトのエクスポートを使用するときに発生する問題

Question

コードエラー

上記のコードを実行してみましたが、機能せず、ブラウザには何も表示されませんでした。 <scripts setup> </script> にコードを記述する他の方法はありますか?私が学んだのは、関数が次の場所にあるということです export デフォルト { name: 'App', //code }中 console.log('It run') など、他のものを入力すると、エラーが発生し、「hello world」さえ表示されないからですか?助けてください ;-;＃＃＃

Answer 1

your code error

// App.vue
<script setup lang="ts">
import { onMounted, reactive, toRefs } from 'vue'

const state = reactive({
    showNavbar: 'xxxx'
})
const { showNavbar } = toRefs(state)

onMounted(async() => {
   console.log('hello world')
})

</script>

<template>

    <main>
         <RouterView />
    </main>
   
</template>

<style lang="scss" scoped>

</style>