vue3+nuxt3版本，Tabs标签不生效

[yeshili]

vue3+nuxt3版本，Tabs标签不生效

都不生效的

[yeshili]

无法直接定位name2

[yeshili]

就算这样子也不生效

[dosubot[bot]]

Hey @yeshili! I'm here to help you with any bugs, questions, or to guide you on how to become a contributor. Let's squash those bugs together! 🤖

To resolve the issue with the Tabs component not working in your Vue 3 and Nuxt 3 project, ensure that you are using the correct version of ViewUIPlus, which is recommended to be version "1.3.19" for compatibility with Vue 3 and Nuxt 3 ^[1].

Additionally, make sure you are using the v-model directive to bind the active tab correctly. Instead of using the value attribute, you should use v-model with the modelValue prop. Here's an example of how you can set it up:

<template>
  <Tabs v-model="activeTab">
    <TabPane label="标签一" name="name1">标签一的内容</TabPane>
    <TabPane label="标签二" name="name2">标签二的内容</TabPane>
    <TabPane label="标签三" name="name3">标签三的内容</TabPane>
  </Tabs>
</template>

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

export default {
  setup() {
    const activeTab = ref('name2'); // Set the initial active tab
    return { activeTab };
  }
};
</script>

Ensure that your Tabs component is correctly imported and that the v-model is bound to a reactive reference (ref) in your setup function. This should help in making the tabs functional.

To continue talking to Dosu, mention @dosu.

---

^{Help Dosu learn! Give it feedback: Great Response | Irrelevant Answer | Incorrect Sources | Too Verbose | Hallucination | Other}

[yeshili]

那文档应该也跟着版本修改才行