ソースを参照

fix(components): docs and type optimization (#1661)

Drjingfubo 3 年 前
コミット
fe72668a29

+ 3 - 3
src/packages/__VUE/cascader/cascader-item.vue

@@ -33,7 +33,7 @@ import { watch, ref, Ref, computed } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 const { create, translate } = createComponent('cascader-item');
 import { convertListToOptions } from './helper';
-import { CascaderPane, CascaderOption, CascaderValue, convertConfig } from './types';
+import { CascaderPane, CascaderOption, CascaderValue, convertConfig, Tabs } from './types';
 import Tree from './tree';
 
 export default create({
@@ -268,9 +268,9 @@ export default create({
           methods.handleNode(node, silent);
         }
       },
-      handleTabClick(tab: any) {
+      handleTabClick(tab: Tabs) {
         currentProcessNode = null;
-        tabsCursor.value = tab.paneKey as number;
+        tabsCursor.value = Number(tab.paneKey);
       },
       formatTabTitle(pane: CascaderPane) {
         return pane.selectedNode ? pane.selectedNode.text : translate('select');

+ 1 - 1
src/packages/__VUE/cascader/demo.vue

@@ -40,7 +40,7 @@
           :title="translate('addressTip')"
           v-model:visible="demo2.visible"
           v-model="demo2.value"
-          label-key="text"
+          text-key="text"
           @change="events.change"
           @path-change="events.pathChange"
           value-key="text"

+ 5 - 5
src/packages/__VUE/cascader/doc.en-US.md

@@ -14,9 +14,9 @@ import { Cascader, Tabs, TabPane } from '@nutui/nutui';
 import { Cascader, Tabs, TabPane } from '@nutui/nutui-taro';
 
 const app = createApp();
-app.use(Cascader)
-.use(Tabs)
-.use(TabPane);
+app.use(Cascader);
+app.use(Tabs);
+app.use(TabPane);
 ```
 
 ### Basic Usage
@@ -139,7 +139,7 @@ use `textKey`、`valueKey`、`childrenKey`Specify the property name.
       title="Select address"
       v-model:visible="state.visible"
       v-model="state.value"
-      label-key="text"
+      text-key="text"
       @change="events.change"
       @path-change="events.pathChange"
       value-key="text"
@@ -441,4 +441,4 @@ export default {
 | Event      | Description                               | Arguments          |
 |------------|-------------------------------------------|--------------------|
 | change     | Triggered when the selected value changes | (value, pathNodes) |
-| pathChange | Triggered when the selected item changes  | (pathNodes)        |
+| path-change | Triggered when the selected item changes  | (pathNodes)        |

+ 5 - 5
src/packages/__VUE/cascader/doc.md

@@ -14,9 +14,9 @@ import { Cascader, Tabs, TabPane } from '@nutui/nutui';
 import { Cascader, Tabs, TabPane } from '@nutui/nutui-taro';
 
 const app = createApp();
-app.use(Cascader)
-.use(Tabs)
-.use(TabPane);
+app.use(Cascader);
+app.use(Tabs);
+app.use(TabPane);
 ```
 
 ### 基础用法
@@ -139,7 +139,7 @@ export default {
       title="地址选择"
       v-model:visible="state.visible"
       v-model="state.value"
-      label-key="text"
+      text-key="text"
       @change="events.change"
       @path-change="events.pathChange"
       value-key="text"
@@ -441,4 +441,4 @@ export default {
 | 事件名     | 说明             | 回调参数           |
 | ---------- | ---------------- | ------------------ |
 | change     | 选中值改变时触发 | (value, pathNodes) |
-| pathChange | 选中项改变时触发 | (pathNodes)        |
+| path-change | 选中项改变时触发 | (pathNodes)        |

+ 5 - 0
src/packages/__VUE/cascader/types.ts

@@ -8,6 +8,11 @@ export type CascaderConfig = {
   text?: string;
   children?: string;
 };
+export type Tabs = {
+  title: string;
+  paneKey: string;
+  disabled: boolean;
+};
 
 export type CascaderOption = {
   text?: string;

+ 2 - 2
src/packages/__VUE/circleprogress/index.vue

@@ -63,7 +63,7 @@ export default create({
     }
   },
 
-  setup(props, { emit }) {
+  setup(props) {
     const slotDefault = !!useSlots().default;
     const refRandomId = Math.random().toString(36).slice(-8);
     const classes = computed(() => {
@@ -99,7 +99,7 @@ export default create({
       let color = props.color;
       const colorArr = Object.keys(color).sort((a, b) => parseFloat(a) - parseFloat(b));
       let stopArr: object[] = [];
-      colorArr.map((item, index) => {
+      colorArr.map((item) => {
         let obj = {
           key: '',
           value: ''

+ 4 - 4
src/packages/__VUE/drag/index.vue

@@ -37,7 +37,7 @@ export default create({
       }
     }
   },
-  setup(props, { emit }) {
+  setup(props) {
     const myDrag = ref();
     const state = reactive({
       keepAlive: false,
@@ -185,9 +185,9 @@ export default create({
     });
     onDeactivated(() => {
       state.keepAlive = true;
-      (myDrag as any).value.removeEventListener('touchstart', touchStart);
-      (myDrag as any).value.removeEventListener('touchmove', touchMove);
-      (myDrag as any).value.removeEventListener('touchend', touchEnd);
+      myDrag.value.removeEventListener('touchstart', touchStart);
+      myDrag.value.removeEventListener('touchmove', touchMove);
+      myDrag.value.removeEventListener('touchend', touchEnd);
     });
     return {
       classes,

+ 1 - 14
src/packages/__VUE/ecard/index.vue

@@ -33,20 +33,7 @@
 <script lang="ts">
 import { Ref, ref, watch } from 'vue';
 import { createComponent } from '@/packages/utils/create';
-const { componentName, create, translate } = createComponent('ecard');
-
-interface props {
-  chooseText: string; // 选择文案
-  dataList: Array<any>; // 电子卡列表
-  cardAmountMin: number; // 其他面值最小值
-  cardAmountMax: number; // 其他面值最大值
-  cardBuyMin: number; // 其他面值最小值
-  cardBuyMax: number; // 其他面值最大值
-  modelValue: number; // 购买电子卡需花费的价钱
-  placeholder: string; //提示语
-  suffix: string; // 符号标示
-  otherValueText: string; // 其他面值
-}
+const { create, translate } = createComponent('ecard');
 
 export default create({
   props: {

+ 5 - 7
src/packages/__VUE/numberkeyboard/index.taro.vue

@@ -33,7 +33,7 @@
                 { delete: item.type == 'delete' }
               ]"
               @touchstart="(event) => onTouchstart(item, event)"
-              @touchmove="(event) => onTouchMove(item, event)"
+              @touchmove="(event) => onTouchMove(event)"
               @touchend="onTouchEnd"
             >
               <template v-if="item.type == 'number' || item.type == 'custom'">{{ item.id }}</template>
@@ -53,7 +53,7 @@
             <div
               :class="['key', { active: clickKeyIndex == 'delete' }]"
               @touchstart="(event) => onTouchstart({ id: 'delete', type: 'delete' }, event)"
-              @touchmove="(event) => onTouchMove({ id: 'delete', type: 'delete' }, event)"
+              @touchmove="(event) => onTouchMove(event)"
               @touchend="onTouchEnd"
             >
               <img
@@ -121,7 +121,7 @@ export default create({
   },
   emits: ['input', 'delete', 'close', 'update:value'],
   setup(props, { emit }) {
-    const clickKeyIndex = ref(undefined);
+    const clickKeyIndex: Ref<string | undefined> = ref(undefined);
     const show = ref(props.visible);
     const root = ref<HTMLElement>();
     function defaultKey() {
@@ -190,7 +190,7 @@ export default create({
       }
     );
 
-    function onTouchstart(item: any, event: any) {
+    function onTouchstart(item: { id: string; type: string }, event: TouchEvent) {
       event.stopPropagation();
       clickKeyIndex.value = item.id;
       if (item.type == 'number' || item.type == 'custom') {
@@ -207,7 +207,7 @@ export default create({
         emit('update:value', props.value.slice(0, props.value.length - 1));
       }
     }
-    function onTouchMove(id: any, event: any) {
+    function onTouchMove(event: TouchEvent) {
       event.stopPropagation();
     }
     function onTouchEnd() {
@@ -217,8 +217,6 @@ export default create({
     function closeBoard() {
       emit('close');
     }
-
-    onMounted(() => {});
     return {
       clickKeyIndex,
       defaultKey,

+ 6 - 9
src/packages/__VUE/numberkeyboard/index.vue

@@ -35,7 +35,7 @@
                 { delete: item.type == 'delete' }
               ]"
               @touchstart="(event) => onTouchstart(item, event)"
-              @touchmove="(event) => onTouchMove(item, event)"
+              @touchmove="(event) => onTouchMove(event)"
               @touchend="(event) => onTouchEnd(event)"
             >
               <template v-if="item.type == 'number' || item.type == 'custom'">{{ item.id }}</template>
@@ -131,9 +131,7 @@ export default create({
   },
   emits: ['input', 'delete', 'close', 'update:value'],
   setup(props, { emit }) {
-    // console.log(props.overlay);
-
-    const clickKeyIndex = ref(undefined);
+    const clickKeyIndex: Ref<string | undefined> = ref(undefined);
     const show = ref(props.visible);
     const root = ref<HTMLElement>();
     function defaultKey() {
@@ -153,7 +151,7 @@ export default create({
     }
 
     function getBasicKeys() {
-      const keys: any = [];
+      const keys: Array<unknown> = [];
       for (let i = 1; i <= 9; i++) {
         keys.push({ id: i, type: 'number' });
       }
@@ -202,7 +200,7 @@ export default create({
       }
     );
 
-    function onTouchstart(item: any, event: any) {
+    function onTouchstart(item: { id: string; type: string }, event: TouchEvent) {
       event.stopPropagation();
       clickKeyIndex.value = item.id;
       if (item.type == 'number' || item.type == 'custom') {
@@ -219,10 +217,10 @@ export default create({
         emit('update:value', props.value.slice(0, props.value.length - 1));
       }
     }
-    function onTouchMove(id: any, event: any) {
+    function onTouchMove(event: TouchEvent) {
       event.stopPropagation();
     }
-    function onTouchEnd(event: any) {
+    function onTouchEnd(event: TouchEvent) {
       event.preventDefault();
       clickKeyIndex.value = undefined;
     }
@@ -231,7 +229,6 @@ export default create({
       emit('close');
     }
 
-    onMounted(() => {});
     return {
       clickKeyIndex,
       defaultKey,

+ 0 - 3
src/packages/__VUE/progress/index.taro.vue

@@ -3,7 +3,6 @@
     <div
       class="nut-progress-outer"
       :id="'nut-progress-outer-taro-' + randRef"
-      ref="progressOuter"
       :class="[showText && !textInside ? 'nut-progress-outer-part' : '', size ? 'nut-progress-' + size : '']"
       :style="{ height: height }"
     >
@@ -107,7 +106,6 @@ export default create({
   setup(props, { emit }) {
     const slotDefault = !!useSlots().default;
     const height = ref(props.strokeWidth + 'px');
-    const progressOuter = ref<any>();
     const insideText = ref();
     const refRandomId = Math.random().toString(36).slice(-8);
     const randRef = ref(refRandomId);
@@ -130,7 +128,6 @@ export default create({
       height,
       bgStyle,
       textStyle,
-      progressOuter,
       insideText,
       randRef,
       slotDefault

+ 1 - 1
src/packages/__VUE/progress/index.vue

@@ -101,7 +101,7 @@ export default create({
       default: true
     }
   },
-  setup(props, { emit }) {
+  setup(props) {
     const slotDefault = !!useSlots().default;
     const height = ref(props.strokeWidth + 'px');
     const progressOuter = ref();

+ 1 - 1
src/packages/__VUE/tabbar/index.taro.vue

@@ -45,7 +45,7 @@ export default create({
       val: props.visible,
       children: []
     });
-    function changeIndex(index: number, active: any) {
+    function changeIndex(index: number, active: number | string) {
       emit('update:visible', active);
       parentData.modelValue = active;
       emit('tab-switch', parentData.children[index], active);

+ 1 - 1
src/packages/__VUE/tabbar/index.vue

@@ -45,7 +45,7 @@ export default create({
       val: props.visible,
       children: []
     });
-    function changeIndex(index: number, active: any) {
+    function changeIndex(index: number, active: number | string) {
       emit('update:visible', active);
       parentData.modelValue = active;
       emit('tab-switch', parentData.children[index], active);

+ 2 - 2
src/packages/__VUE/tabbaritem/index.taro.vue

@@ -119,7 +119,7 @@ export default create({
       let key = props.name ?? state.index;
       let index = null;
       if (props.name) {
-        index = parent.children.findIndex((item: any) => {
+        index = parent.children.findIndex((item: { name: string | number }) => {
           return item.name == key;
         });
       }
@@ -136,7 +136,7 @@ export default create({
       state.active = value;
       let index = value;
       if (props.name) {
-        index = parent.children.findIndex((item: any) => {
+        index = parent.children.findIndex((item: { name: string | number }) => {
           return item.name == value;
         });
       }

+ 1 - 1
src/packages/__VUE/tabbaritem/index.vue

@@ -123,7 +123,7 @@ export default create({
       let key = props.name ?? state.index;
       let index = null;
       if (props.name) {
-        index = parent.children.findIndex((item: any) => {
+        index = parent.children.findIndex((item: { name: string | number }) => {
           return item.name == key;
         });
       }