ref,computed  用法

 

<template>
      <div>
          <h1>{{count}}</h1>
          <h1>{{double}}</h1>
          <button @click="increase">+1</button>
      </div>
</template>

<script lang="ts">

import { ref,computed } from 'vue';    
export default {
  name: 'App',
  setup(){

    const count = ref(0)
    const double = computed(()=>{
      return count.value * 2
    })

    const increase = () => {
      count.value ++
    }
    return {
      count,
      double,
      increase
    }
  } 
};
</script>