请写一个基于vue3的根据选择器不同选择显示不同表头的例子

好的，我可以回答这个问题。以下是一个基于vue3的根据选择器不同选择显示不同表头的例子：

<template>
  <div>
    <select v-model="selected">
      <option value="table1">表格1</option>
      <option value="table2">表格2</option>
    </select>
    <table>
      <thead>
        <tr v-if="selected === 'table1'">
          <th>姓名</th>
          <th>年龄</th>
        </tr>
        <tr v-else-if="selected === 'table2'">
          <th>城市</th>
          <th>人口</th>
        </tr>
      </thead>
      <tbody>
        <!-- 表格内容 -->
      </tbody>
    </table>
  </div>
</template>

<script>
export default {
  data() {
    return {
      selected: 'table1',
    };
  },
};
</script>

这个例子中，我们使用了一个 `select` 元素来让用户选择要显示的表格。根据用户的选择，我们使用 `v-if` 和 `v-else-if` 来决定显示哪个表头。注意，我们在 `thead` 元素中使用了 `tr` 元素来定义表头行，而不是直接使用 `th` 元素。这是因为我们需要根据选择器来判断要显示哪个表头行。