VUE3-07-工作笔记

在Vue 3中，你可以使用<script setup>来创建组件，这可以让你写更少的模板代码，并直接在script标签中使用Composition API。

以下是一个简单的使用<script setup>的Vue 3组件示例：




<template>
  <button @click="increment">Count is: {{ count }}</button>
</template>
 
<script setup>
import { ref } from 'vue'
 
const count = ref(0)
 
function increment() {
  count.value++
}
</script>

在这个例子中，我们创建了一个简单的计数器组件。我们使用<script setup>标签替换了传统的<script>标签。我们导入了Vue的ref函数来创建一个响应式的计数器，然后定义了一个increment函数来增加计数器的值。在模板中，我们使用了count.value来获取计数器的当前值，并为按钮绑定了点击事件，该事件触发increment函数。

VUE3-07-工作笔记

评论已关闭

推荐阅读