【Vue】条件渲染

<script setup>
import {ref}from 'vue'
  let counter=ref(10)
  function increase(){
    counter.value++
  }
  function decrease(){
    counter.value--
  }
  function isTooBig(counter){
    return counter>15
  }
</script>

<template>
  <button @click="increase" v-if="!isTooBig(counter)">+</button>
  <p id="id1">{{ counter }}</p>
  <button @click="decrease" v-if="counter>=10">-</button>
</template>

<style scoped>
#id1{
  color: aqua;
  font-size: 40px;
}
</style>