fix(tabs): resolve tabpane show errors #1544 (#1636)

Author: Drjingfubo

src/packages/__VUE/tabs/common.ts

@@ -1,4 +1,5 @@
 import { pxCheck } from '@/packages/utils/pxCheck';
+import { TypeOfFun } from '@/packages/utils/util';
 import { onMounted, provide, VNode, ref, Ref, computed, onActivated, watch } from 'vue';
 export class Title {
   title: string = '';
@@ -71,8 +72,14 @@ export const component = {
         if (type == 'nut-tabpane') {
           let title = new Title();
           if (vnode.props?.title || vnode.props?.['pane-key'] || vnode.props?.['paneKey']) {
+            let paneKeyType = TypeOfFun(vnode.props?.['pane-key']);
+            let paneIndex =
+              paneKeyType == 'number' || paneKeyType == 'string' ? String(vnode.props?.['pane-key']) : null;
+            let camelPaneKeyType = TypeOfFun(vnode.props?.['paneKey']);
+            let camelPaneIndex =
+              camelPaneKeyType == 'number' || camelPaneKeyType == 'string' ? String(vnode.props?.['paneKey']) : null;
             title.title = vnode.props?.title;
-            title.paneKey = vnode.props?.['pane-key'] || vnode.props?.['paneKey'] || index;
+            title.paneKey = paneIndex || camelPaneIndex || String(index);
             title.disabled = vnode.props?.disabled;
           } else {
             // title.titleSlot = vnode.children?.title() as VNode[];

src/packages/__VUE/tabs/demo.vue

@@ -47,17 +47,17 @@
       <nut-tabpane v-for="item in state.list5" :title="'Tab ' + item"> Tab {{ item }} </nut-tabpane>
     </nut-tabs>
     <h2>{{ translate('title7') }}</h2>
-    <nut-tabs v-model="state.tab1value" size="large">
+    <nut-tabs v-model="state.tab8value" size="large">
       <nut-tabpane title="Tab 1"> Tab 1 </nut-tabpane>
       <nut-tabpane title="Tab 2"> Tab 2 </nut-tabpane>
       <nut-tabpane title="Tab 3"> Tab 3 </nut-tabpane>
     </nut-tabs>
-    <nut-tabs v-model="state.tab1value" size="normal">
+    <nut-tabs v-model="state.tab8value" size="normal">
       <nut-tabpane title="Tab 1"> Tab 1 </nut-tabpane>
       <nut-tabpane title="Tab 2"> Tab 2 </nut-tabpane>
       <nut-tabpane title="Tab 3"> Tab 3 </nut-tabpane>
     </nut-tabs>
-    <nut-tabs v-model="state.tab1value" size="small">
+    <nut-tabs v-model="state.tab8value" size="small">
       <nut-tabpane title="Tab 1"> Tab 1 </nut-tabpane>
       <nut-tabpane title="Tab 2"> Tab 2 </nut-tabpane>
       <nut-tabpane title="Tab 3"> Tab 3 </nut-tabpane>
@@ -132,6 +132,7 @@ export default createDemo({
       tab5value: '0',
       tab6value: '0',
       tab7value: 'c1',
+      tab8value: '0',
       list3: Array.from(new Array(2).keys()),
       list4: Array.from(new Array(10).keys()),
       list5: Array.from(new Array(2).keys()),

src/sites/assets/util/useTranslate.ts

@@ -4,7 +4,6 @@ export const useTranslate = (object: Record<string, any>) => {
   for (const [key, value] of Object.entries(object)) {
     Locale.merge(key, value);
   }
-  console.log('merge res > ', Locale.languages());
 };
 
 export const translateChange = () => {