vue3怎么用ref实现点击一个按钮增加字体大小，点击一个按钮减小字体大小

要 `ref` 实现点击一个按钮增加字体大小，点击一个按钮减小字体大小，可以通过以下步骤实现：

1. 在 `setup` 函数中，使用 `ref` 创建一个变量 `fontSize`，并初始化为默认字体大小。

2. 在模板中，使用 `:style` 绑定样式对象，动态设置字体大小。

3. 在模板中，使用 `@click` 绑定点击事件，分别在点击事件中修改 `fontSize` 变量的值，从而改变字体大小。

下面是一个示例：

<template>
  <div>
    <p :style="{ fontSize: fontSize + 'px' }">Hello World</p>
    <button @click="increaseFontSize">增加字体大小</button>
    <button @click="decreaseFontSize">减小字体大小</button>
  </div>
</template>

<script>
import { ref } from 'vue'

export default {
  setup() {
    const fontSize = ref(16)

    const increaseFontSize = () => {
      fontSize.value += 2
    }

    const decreaseFontSize = () => {
      fontSize.value -= 2
    }

    return {
      fontSize,
      increaseFontSize,
      decreaseFontSize
    }
  }
}
</script>

在上面的示例中，我们使用 `ref` 创建了一个名为 `fontSize` 的变量，并初始化为默认字体大小 `16`。然后在模板中使用 `:style` 绑定样式对象，动态设置字体大小为 `fontSize + 'px'`。接着，我们在模板中使用 `@click` 绑定点击事件，分别在点击事件中调用 `increaseFontSize` 和 `decreaseFontSize` 方法，从而改变 `fontSize` 的值。

需要注意的是，在改变 `fontSize` 的值时，我们使用 `.value` 来获取和设置其值。例如，`fontSize.value += 2` 就是将 `fontSize` 的值增加 `2`。