import { ref } from 'vue';引入了 Vue 的ref函数，用于创建响应式数据。const message = ref('Hello Vue3');创建了一个响应式变量message并初始化为字符串'Hello Vue3'。<h1>{``{ message }}</h1>使用了 Vue 的插值表达式{``{ message }}来显示message变量的值。- 样式部分目前为空，您可以在这里添加 CSS 来美化组件。
-
data 函数 ：返回一个对象，其中包含一个名为
count的属性，初始值为 0。这个属性是响应式的，当它变化时，视图也会相应更新。 -
methods 对象 ：包含一个名为
increment的方法，当调用这个方法时，count的值会增加 1。 -
mounted 钩子：在组件被挂载到 DOM 后执行，这里它在控制台输出了一条消息 'Vue mounted...'。
-
模板部分 ：包含一个按钮，当点击这个按钮时，会触发
increment方法。按钮上显示的文本是count: {``{ count }}，其中{``{ count }}是一个插值表达式，用于显示count的当前值。