能不能基于vue3 给出完整的示例代码

当然可以，以下是一个基于 Vue 3 的示例代码：

<template>
  <div>
    <h1>{{ message }}</h1>
    <button @click="increment">增加</button>
  </div>
</template>

<script>
import { ref } from 'vue';

export default {
  setup() {
    const count = ref(0);
    const message = ref('你已经点击了 ' + count.value + ' 次');

    function increment() {
      count.value++;
      message.value = '你已经点击了 ' + count.value + ' 次';
    }

    return {
      count,
      message,
      increment,
    };
  },
};
</script>

这个示例代码中，我们使用了 Vue 3 的 `ref` 函数来声明了一个响应式数据 `count` 和 `message`，并且在 `setup` 函数中定义了一个 `increment` 函数来增加 `count` 的值，然后更新 `message` 的文本内容。

在模板中，我们使用了插值绑定 `{{ message }}` 来显示 `message` 的值，并且在按钮的 `click` 事件中调用了 `increment` 函数。

这个示例代码可以让你更好地了解 Vue 3 的响应式系统和 `setup` 函数的使用方法。