Vue页面结构

Vue页面结构

Vue页面结构
App.vue

<!--html标签-->
<template><div><h1>饿了么？</h1></div><HelloWorld msg="Vite + Vue" />
</template>
<!--js代码 vue3的语法-->
<script setup>
import HelloWorld from './components/HelloWorld.vue'</script>
<!--css样式 美化-->
<style scoped></style>

HelloWorld.vue

<script setup>
import { ref } from 'vue'defineProps({msg: String,
})const count = ref(0)
</script><template><h1>{{ msg }}</h1><h1>吃的什么啊？</h1>
</template><style scoped>
.read-the-docs {color: #888;
}
</style>