2025/2/8第一次更新

node_modules/@tuniao/tnui-vue3-uniapp/components/switch-tab/src/switch-tab.vue

@@ -0,0 +1,37 @@
+<script lang="ts" setup>
+import { switchTabEmits, switchTabProps } from './switch-tab'
+import { useSwitchTab, useSwitchTabCustomStyle } from './composables'
+
+const props = defineProps(switchTabProps)
+const emits = defineEmits(switchTabEmits)
+
+const { tabClickEvent } = useSwitchTab(props, emits)
+const { ns, tabClass, tabStyle, switchTabClass, switchTabStyle } =
+  useSwitchTabCustomStyle(props)
+</script>
+
+<template>
+  <view :class="[switchTabClass]" :style="switchTabStyle">
+    <!-- 标签栏 -->
+    <view :class="[ns.e('tabs')]">
+      <view
+        v-for="(tabItem, tabIndex) in tabs"
+        :key="tabIndex"
+        :class="[tabClass(tabIndex)]"
+        :style="tabStyle(tabIndex)"
+        @tap.stop="tabClickEvent(tabIndex)"
+      >
+        <view class="tab-item bg" />
+        <view class="tab-item text">{{ tabItem }}</view>
+      </view>
+    </view>
+    <!-- 内容区域 -->
+    <view :class="[ns.e('content')]">
+      <slot />
+    </view>
+  </view>
+</template>
+
+<style lang="scss" scoped>
+@import '../../../theme-chalk/src/switch-tab.scss';
+</style>