Masalah yang dihadapi apabila menggunakan lalai eksport dalam Vue

Question

Ralat kod

Saya cuba menjalankan kod di atas tetapi ia tidak berfungsi dan saya tidak dapat melihat apa-apa dalam penyemak imbas. Adakah terdapat cara lain untuk menulis kod dalam <scripts setup> </script>? Apa yang saya pelajari ialah fungsi itu diletakkan di dalam export default { name: 'App', //code }中 Kerana apabila saya menaip apa-apa lagi, seperti console.log('It runs'), saya mendapat ralat dan tidak dapat melihat 'hello world'? Tolong bantu ;-;

Answer 1

ralat kod anda

// 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>