<div :class="{ 'tab': true, 'active': activeTab === index }" v-for="(tab, index) in tabs" :key="index" @click="activeTab = index">
时间: 2023-12-05 11:19:11 浏览: 29
This is a Vue.js template syntax for rendering a list of tabs with conditional classes. The `v-for` directive loops through an array of `tabs`, assigning each item to the `tab` variable and the index to `index`. The `:key` binding ensures that each tab element is uniquely identified in the virtual DOM.
The `:class` binding is used to dynamically set the class name of each tab element based on a condition. In this case, if the `activeTab` variable equals the current tab index, the `active` class is applied, otherwise only the `tab` class is applied.
The `@click` event listener is bound to each tab element to update the `activeTab` variable when the user clicks on the tab.
Overall, this template code generates a set of tabs that can be toggled by the user, with the active tab highlighted with a different class.