setup语法糖
srcipt setup的标签中,属性数据和函数,模板可以直接使用 这是setup语法糖

<template><div>   </div>
</template>
<script setup></script>

怎么使用这个setup函数的语法糖(小案例)

<template><div><p>setup语法糖</p>  <button @click="say">点击</button></div>
</template>
<script setup>const say = () => console.log('hi')
</script>

小案例(显示隐藏图片和计数器)

<template><div><div><img v-show="isshow" src="" alt="图片未显示"><button @click="toggle">显示与隐藏</button></div><div><p>计数器:{{ count }}</p><button @click="say">加1</button></div></div>
</template>
<!-- 在 srcipt setup的标签中,属性数据和函数,模板可以直接使用 这是setup语法糖 -->
<script setup>
import { ref } from "vue";const isshow = ref(true)//是布尔类型 用refconst toggle = () =>{isshow.value = !isshow.value}const count = ref(0)// number是简单数据类型用refconst say = () =>{count.value++}</script>