Browse Source

fix: 组件tsc修改

yangxiaolu3 3 years ago
parent
commit
ba90c85f03

+ 14 - 23
src/packages/__VUE/address/index.taro.vue

@@ -126,23 +126,14 @@
   </nut-popup>
 </template>
 <script lang="ts">
-import { reactive, ref, toRefs, watch, computed } from 'vue';
+import { reactive, ref, toRefs, watch, computed, PropType } from 'vue';
 import { popupProps } from '../popup/props';
-import { RegionData, CustomRegionData } from './type';
+import { RegionData, CustomRegionData, existRegionData } from './type';
 import { createComponent } from '@/packages/utils/create';
 import Popup from '../popup/index.taro.vue';
 import Elevator from '../elevator/index.taro.vue';
 const { create, componentName, translate } = createComponent('address');
 
-interface AddressList {
-  id?: string | number;
-  provinceName: string;
-  cityName: string;
-  countyName: string;
-  townName: string;
-  addressDetail: string;
-  selectedAddress: boolean;
-}
 export default create({
   components: {
     [Popup.name]: Popup,
@@ -168,19 +159,19 @@ export default create({
       default: ''
     },
     province: {
-      type: Array,
+      type: Array as PropType<RegionData[]>,
       default: () => []
     },
     city: {
-      type: Array,
+      type: Array as PropType<RegionData[]>,
       default: () => []
     }, // 市
     country: {
-      type: Array,
+      type: Array as PropType<RegionData[]>,
       default: () => []
     }, // 县
     town: {
-      type: Array,
+      type: Array as PropType<RegionData[]>,
       default: () => []
     }, // 镇
     isShowCustomAddress: {
@@ -188,7 +179,7 @@ export default create({
       default: true
     }, // 是否显示‘选择其他地区’按钮 type=‘exist’ 生效
     existAddress: {
-      type: Array,
+      type: Array as PropType<existRegionData[]>,
       default: () => []
     }, // 现存地址列表
     existAddressTitle: {
@@ -288,7 +279,7 @@ export default create({
         if (index <= -1) {
           newData.push({
             title: item.title,
-            list: [].concat(item)
+            list: ([] as any).concat(item)
           });
         } else {
           newData[index].list.push(item);
@@ -317,7 +308,7 @@ export default create({
           return;
         }
         for (let index = 0; index < num; index++) {
-          let arr: [] = [];
+          let arr: RegionData[] = [];
           switch (index) {
             case 0:
               arr = props.province;
@@ -360,7 +351,7 @@ export default create({
     };
 
     // 切换下一级列表
-    const nextAreaList = (item: RegionData | string) => {
+    const nextAreaList = (item: RegionData) => {
       const tab = tabIndex.value;
 
       const callBackParams: {
@@ -396,11 +387,11 @@ export default create({
     };
 
     // 选择现有地址
-    const selectedExist = (item: RegionData) => {
-      const copyExistAdd = props.existAddress as AddressList[];
+    const selectedExist = (item: existRegionData) => {
+      const copyExistAdd = props.existAddress;
       let prevExistAdd = {};
 
-      copyExistAdd.forEach((list: AddressList) => {
+      copyExistAdd.forEach((list: existRegionData) => {
         if (list && list.selectedAddress) prevExistAdd = list;
         list.selectedAddress = false;
       });
@@ -466,7 +457,7 @@ export default create({
       emit('switch-module', { type: privateType.value });
     };
 
-    const handleElevatorItem = (key: string, item: RegionData | string) => {
+    const handleElevatorItem = (key: string, item: RegionData) => {
       nextAreaList(item);
     };
 

+ 12 - 12
src/packages/__VUE/address/index.vue

@@ -119,9 +119,9 @@
   </nut-popup>
 </template>
 <script lang="ts">
-import { reactive, ref, toRefs, watch, nextTick, computed, Ref, h } from 'vue';
+import { reactive, ref, toRefs, watch, nextTick, computed, Ref, h, PropType } from 'vue';
 import { createComponent } from '@/packages/utils/create';
-import { RegionData, CustomRegionData } from './type';
+import { RegionData, CustomRegionData, existRegionData } from './type';
 import { popupProps } from '../popup/props';
 import Icon from '../icon/index.vue';
 import Popup from '../popup/index.vue';
@@ -158,19 +158,19 @@ export default create({
       default: ''
     },
     province: {
-      type: Array,
+      type: Array as PropType<RegionData[]>,
       default: () => []
     },
     city: {
-      type: Array,
+      type: Array as PropType<RegionData[]>,
       default: () => []
     }, // 市
     country: {
-      type: Array,
+      type: Array as PropType<RegionData[]>,
       default: () => []
     }, // 县
     town: {
-      type: Array,
+      type: Array as PropType<RegionData[]>,
       default: () => []
     }, // 镇
     isShowCustomAddress: {
@@ -178,7 +178,7 @@ export default create({
       default: true
     },
     existAddress: {
-      type: Array,
+      type: Array as PropType<existRegionData[]>,
       default: () => []
     },
     existAddressTitle: {
@@ -267,7 +267,7 @@ export default create({
         if (index <= -1) {
           newData.push({
             title: item.title,
-            list: [].concat(item)
+            list: ([] as any).concat(item)
           });
         } else {
           newData[index].list.push(item);
@@ -297,7 +297,7 @@ export default create({
           return;
         }
         for (let index = 0; index < num; index++) {
-          let arr: [] = [];
+          let arr: RegionData[] = [];
           switch (index) {
             case 0:
               arr = props.province;
@@ -373,11 +373,11 @@ export default create({
       }
     };
 
-    const selectedExist = (item: RegionData) => {
-      const copyExistAdd = props.existAddress as AddressList[];
+    const selectedExist = (item: existRegionData) => {
+      const copyExistAdd = props.existAddress;
       let prevExistAdd = {};
 
-      copyExistAdd.forEach((list: AddressList) => {
+      copyExistAdd.forEach((list: existRegionData) => {
         if (list && list.selectedAddress) prevExistAdd = list;
         list.selectedAddress = false;
       });

+ 11 - 0
src/packages/__VUE/address/type.ts

@@ -7,3 +7,14 @@ export interface CustomRegionData {
   title: string;
   list: any[];
 }
+
+export interface existRegionData {
+  id?: string | number;
+  provinceName: string;
+  cityName: string;
+  countyName: string;
+  townName: string;
+  addressDetail: string;
+  selectedAddress: boolean;
+  [key: string]: any;
+}

+ 2 - 2
src/packages/__VUE/comment/components/CmtBottom.vue

@@ -23,7 +23,7 @@
   </view>
 </template>
 <script lang="ts">
-import { ref, watch, onMounted } from 'vue';
+import { ref, watch, onMounted, PropType } from 'vue';
 
 import { createComponent } from '@/packages/utils/create';
 const { componentName, create, translate } = createComponent('comment-bottom');
@@ -40,7 +40,7 @@ export default create({
     },
 
     operation: {
-      type: Array,
+      type: Array as PropType<string[]>,
       default: ['replay', 'like', 'more']
     }
   },

+ 18 - 8
src/packages/__VUE/comment/components/CmtImages.vue

@@ -5,7 +5,7 @@
       class="nut-comment-images__item nut-comment-images__item--video"
       v-for="(itV, index) in videos"
       :key="itV.id"
-      @click="showImages('video', index, index)"
+      @click="showImages('video', index)"
     >
       <img :src="itV.mainUrl" />
       <view class="nut-comment-images__play"></view>
@@ -31,11 +31,21 @@
   </view>
 </template>
 <script lang="ts">
-import { ref, watch, onMounted } from 'vue';
+import { ref, watch, onMounted, PropType } from 'vue';
 
 import { createComponent } from '@/packages/utils/create';
 const { componentName, create } = createComponent('comment-images');
 
+interface VideosType {
+  id: number | string;
+  mainUrl: string;
+  videoUrl: string;
+}
+interface ImagesType {
+  smallImgUrl: string;
+  bigImgUrl: string;
+  imgUrl: string;
+}
 export default create({
   props: {
     type: {
@@ -43,11 +53,11 @@ export default create({
       default: 'one' // one multi
     },
     videos: {
-      type: Array,
+      type: Array as PropType<VideosType[]>,
       default: () => []
     },
     images: {
-      type: Array,
+      type: Array as PropType<ImagesType[]>,
       default: () => []
     }
   },
@@ -57,7 +67,7 @@ export default create({
   setup(props, { emit }) {
     const isShowImage = ref(false);
     const initIndex = ref(1);
-    const totalImages = ref([]);
+    const totalImages = ref<(VideosType | ImagesType)[]>([]);
 
     watch(
       () => [props.videos, props.images],
@@ -67,7 +77,7 @@ export default create({
             el.type = 'video';
           });
         }
-        totalImages.value = value[0].concat(value[1]);
+        totalImages.value = (value[0] as any).concat(value[1]);
       },
       { deep: true }
     );
@@ -78,7 +88,7 @@ export default create({
           el.type = 'video';
         });
       }
-      totalImages.value = props.videos.concat(props.images);
+      totalImages.value = (props.videos as any).concat(props.images);
     });
 
     const showImages = (type: string, index: string | number) => {
@@ -88,7 +98,7 @@ export default create({
       emit('clickImages', {
         type,
         index: i,
-        value: type == 'img' ? images[i] : videos[i]
+        value: type == 'img' ? images[i as number] : videos[i as number]
       });
     };
 

+ 15 - 4
src/packages/__VUE/comment/index.taro.vue

@@ -40,7 +40,7 @@
   </view>
 </template>
 <script lang="ts">
-import { ref, onMounted, computed, watch } from 'vue';
+import { ref, onMounted, computed, PropType } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 const { componentName, create } = createComponent('comment');
 
@@ -48,6 +48,17 @@ import CommentHeader from './components/CmtHeader.vue';
 import CommentImages from './components/CmtImages.vue';
 import CommentBottom from './components/CmtBottom.vue';
 
+interface VideosType {
+  id: number | string;
+  mainUrl: string;
+  videoUrl: string;
+}
+interface ImagesType {
+  smallImgUrl: string;
+  bigImgUrl: string;
+  imgUrl: string;
+}
+
 export default create({
   props: {
     headerType: {
@@ -66,11 +77,11 @@ export default create({
     },
 
     videos: {
-      type: Array,
+      type: Array as PropType<VideosType[]>,
       default: () => []
     },
     images: {
-      type: Array,
+      type: Array as PropType<ImagesType[]>,
       default: () => []
     },
 
@@ -90,7 +101,7 @@ export default create({
     },
 
     operation: {
-      type: Array,
+      type: Array as PropType<string[]>,
       default: ['replay', 'like', 'more']
     }
   },

+ 15 - 4
src/packages/__VUE/comment/index.vue

@@ -40,7 +40,7 @@
   </view>
 </template>
 <script lang="ts">
-import { ref, onMounted, computed, watch } from 'vue';
+import { ref, onMounted, computed, PropType } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 const { componentName, create, translate } = createComponent('comment');
 
@@ -48,6 +48,17 @@ import CommentHeader from './components/CmtHeader.vue';
 import CommentImages from './components/CmtImages.vue';
 import CommentBottom from './components/CmtBottom.vue';
 
+interface VideosType {
+  id: number | string;
+  mainUrl: string;
+  videoUrl: string;
+}
+interface ImagesType {
+  smallImgUrl: string;
+  bigImgUrl: string;
+  imgUrl: string;
+}
+
 export default create({
   props: {
     headerType: {
@@ -66,11 +77,11 @@ export default create({
     },
 
     videos: {
-      type: Array,
+      type: Array as PropType<VideosType[]>,
       default: () => []
     },
     images: {
-      type: Array,
+      type: Array as PropType<ImagesType[]>,
       default: () => []
     },
 
@@ -90,7 +101,7 @@ export default create({
     },
 
     operation: {
-      type: Array,
+      type: Array as PropType<string[]>,
       default: ['replay', 'like', 'more']
     }
   },

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

@@ -31,14 +31,14 @@ export default create({
     startTime: {
       // 可以是服务器当前时间
       type: [Number, String],
-      validator(v) {
+      validator(v: Date) {
         const dateStr = new Date(v).toString().toLowerCase();
         return dateStr !== 'invalid date';
       }
     },
     endTime: {
       type: [Number, String],
-      validator(v) {
+      validator(v: Date) {
         const dateStr = new Date(v).toString().toLowerCase();
         return dateStr !== 'invalid date';
       }

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

@@ -30,14 +30,14 @@ export default create({
     startTime: {
       // 可以是服务器当前时间
       type: [Number, String],
-      validator(v) {
+      validator(v: Date) {
         const dateStr = new Date(v).toString().toLowerCase();
         return dateStr !== 'invalid date';
       }
     },
     endTime: {
       type: [Number, String],
-      validator(v) {
+      validator(v: Date) {
         const dateStr = new Date(v).toString().toLowerCase();
         return dateStr !== 'invalid date';
       }

+ 0 - 1
src/packages/__VUE/ellipsis/index.taro.vue

@@ -78,7 +78,6 @@ export default create({
     const rootContain = ref(null);
     const symbolContain = ref(null);
     let contantCopy = ref(props.content);
-    let container: any = null;
     let maxHeight = 0; // 超出的最大高度
     let lineHeight = 0; // 当行的最大高度
     let originHeight = 0; // 原始高度

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

@@ -2,9 +2,9 @@
   <view :class="classes" @click="handleClick" ref="root">
     <view v-if="!exceeded">{{ content }}</view>
     <view v-if="exceeded && !expanded"
-      >{{ ellipsis.leading
+      >{{ ellipsis && ellipsis.leading
       }}<span class="nut-ellipsis__text" v-if="expandText" @click.stop="clickHandle(1)">{{ expandText }}</span
-      >{{ ellipsis.tailing }}
+      >{{ ellipsis && ellipsis.tailing }}
     </view>
     <view v-if="exceeded && expanded">
       {{ content }}

+ 2 - 5
src/packages/__VUE/image/index.vue

@@ -14,7 +14,7 @@
   </view>
 </template>
 <script lang="ts">
-import { reactive, toRefs, computed, PropType, useSlots, watch } from 'vue';
+import { reactive, toRefs, computed, PropType, useSlots, watch, CSSProperties } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 import { pxCheck } from '../../utils/pxCheck';
 const { componentName, create } = createComponent('image');
@@ -91,10 +91,7 @@ export default create({
       return style;
     });
     const styles = computed(() => {
-      let styless: {
-        objectFit: string;
-        objectPosition: string;
-      } = {
+      let styless: CSSProperties = {
         objectFit: props.fit,
         objectPosition: props.position
       };

+ 1 - 1
src/packages/__VUE/imagepreview/imagePreviewItem.vue

@@ -109,7 +109,7 @@ export default create({
     });
 
     // 图片加载完成
-    const imageLoad = (event: TouchEvent) => {
+    const imageLoad = (event: Event) => {
       const { naturalWidth, naturalHeight } = event.target as HTMLImageElement;
       state.imageRatio = naturalHeight / naturalWidth;
     };

+ 29 - 19
src/packages/__VUE/noticebar/index.taro.vue

@@ -18,8 +18,7 @@
       <view ref="wrap" :class="`nut-noticebar__page-wrap wrap${id}`">
         <view
           ref="content"
-          class="nut-noticebar__page-wrap-content"
-          :class="[animationClass, { 'nut-ellipsis': isEllipsis }, `content${id}`]"
+          :class="wrapContentClass"
           :style="contentStyle"
           @animationend="onAnimationEnd"
           @webkitAnimationEnd="onAnimationEnd"
@@ -72,24 +71,28 @@
   </view>
 </template>
 <script lang="ts">
-import {
-  toRefs,
-  onMounted,
-  onUnmounted,
-  reactive,
-  computed,
-  CSSProperties,
-  onActivated,
-  onDeactivated,
-  ref,
-  watch,
-  h
-} from 'vue';
+import { toRefs, onMounted, onUnmounted, reactive, computed, onActivated, onDeactivated, ref, watch, h } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 import { pxCheck } from '@/packages/utils/pxCheck';
 const { componentName, create } = createComponent('noticebar');
 import Taro from '@tarojs/taro';
 
+interface stateProps {
+  wrapWidth: number;
+  firstRound: boolean;
+  duration: number;
+  offsetWidth: number;
+  showNoticebar: boolean;
+  animationClass: string;
+  animate: boolean;
+  scrollList: never[];
+  distance: number;
+  timer: null;
+  keepAlive: boolean;
+  isCanScroll: null | boolean;
+  id: number;
+}
+
 export default create({
   props: {
     // 滚动方向  across 横向 vertical 纵向
@@ -159,12 +162,10 @@ export default create({
   emits: ['click', 'close'],
 
   setup(props, { emit, slots }) {
-    // console.log('componentName', componentName);
-
     const wrap = ref<null | HTMLElement>(null);
     const content = ref<null | HTMLElement>(null);
 
-    const state = reactive({
+    const state = reactive<stateProps>({
       wrapWidth: 0,
       firstRound: true,
       duration: 0,
@@ -196,6 +197,14 @@ export default create({
       }
     });
 
+    const wrapContentClass = computed(() => {
+      return {
+        'nut-noticebar__page-wrap-content': true,
+        'nut-ellipsis': isEllipsis.value,
+        [`content${state.id}`]: true
+      };
+    });
+
     const iconShow = computed(() => {
       if (props.leftIcon == 'close') {
         return false;
@@ -415,7 +424,8 @@ export default create({
       go,
       handleClickIcon,
       slots,
-      pxCheck
+      pxCheck,
+      wrapContentClass
     };
   }
 });

+ 15 - 10
src/packages/__VUE/noticebar/index.vue

@@ -18,12 +18,11 @@
       <view ref="wrap" class="nut-noticebar__page-wrap">
         <view
           ref="content"
-          :class="['nut-noticebar__page-wrap-content', animationClass, { 'nut-ellipsis': isEllipsis }]"
+          :class="wrapContentClass"
           :style="contentStyle"
           @animationend="onAnimationEnd"
           @webkitAnimationEnd="onAnimationEnd"
-        >
-          <slot>{{ text }}</slot>
+          ><slot>{{ text }}</slot>
         </view>
       </view>
       <view v-if="closeMode || rightIcon" class="nut-noticebar__page-righticon" @click.stop="onClickIcon">
@@ -77,12 +76,12 @@ import {
   onUnmounted,
   reactive,
   computed,
-  CSSProperties,
   onActivated,
   onDeactivated,
   ref,
   watch,
-  h
+  h,
+  Slots
 } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 const { componentName, create } = createComponent('noticebar');
@@ -97,7 +96,7 @@ interface StateProps {
   animationClass: string;
 
   animate: boolean;
-  scrollList: [];
+  scrollList: Slots[];
   distance: number;
   timer: null;
   keepAlive: boolean;
@@ -173,8 +172,6 @@ export default create({
   emits: ['click', 'close'],
 
   setup(props, { emit, slots }) {
-    // console.log('componentName', componentName);
-
     const wrap = ref<null | HTMLElement>(null);
     const content = ref<null | HTMLElement>(null);
 
@@ -185,7 +182,6 @@ export default create({
       offsetWidth: 0,
       showNoticebar: true,
       animationClass: '',
-
       animate: false,
       scrollList: [],
       distance: 0,
@@ -209,6 +205,14 @@ export default create({
       }
     });
 
+    const wrapContentClass = computed(() => {
+      return {
+        'nut-noticebar__page-wrap-content': true,
+        'nut-ellipsis': isEllipsis.value,
+        [state.animationClass]: true
+      };
+    });
+
     const iconShow = computed(() => {
       if (props.leftIcon == 'close') {
         return false;
@@ -416,7 +420,8 @@ export default create({
       go,
       handleClickIcon,
       slots,
-      pxCheck
+      pxCheck,
+      wrapContentClass
     };
   }
 });

+ 2 - 2
src/packages/__VUE/sku/components/SkuOperate.vue

@@ -16,7 +16,7 @@
   </view>
 </template>
 <script lang="ts">
-import { ref, onMounted } from 'vue';
+import { PropType } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 const { componentName, create } = createComponent('sku-operate');
 
@@ -24,7 +24,7 @@ export default create({
   props: {
     // 底部按钮配置  confirm cart  buy
     btnOptions: {
-      type: Array,
+      type: Array as PropType<string[]>,
       default: () => ['confirm']
     },
 

+ 8 - 1
src/packages/__VUE/sku/components/SkuSelect.vue

@@ -21,6 +21,13 @@ import { ref, watch, onMounted } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 const { componentName, create } = createComponent('sku-select');
 
+interface SkuInfo {
+  name: string;
+  id: number;
+  active: boolean;
+  disable: boolean;
+  [props: string]: any;
+}
 export default create({
   props: {
     sku: {
@@ -31,7 +38,7 @@ export default create({
   emits: ['selectSku'],
 
   setup(props: any, { emit }) {
-    const skuInfo = ref([]);
+    const skuInfo = ref<SkuInfo[]>([]);
 
     watch(
       () => props.sku,

+ 12 - 12
src/packages/__VUE/sku/index.taro.vue

@@ -62,7 +62,7 @@
   </nut-popup>
 </template>
 <script lang="ts">
-import { ref, watch, onMounted } from 'vue';
+import { ref, watch, PropType } from 'vue';
 import SkuHeader from './components/SkuHeader.vue';
 import SkuSelect from './components/SkuSelect.vue';
 import SkuStepper from './components/SkuStepper.vue';
@@ -119,7 +119,7 @@ export default create({
 
     // 底部按钮配置  confirm cart  buy
     btnOptions: {
-      type: Array,
+      type: Array as PropType<string[]>,
       default: () => ['confirm']
     },
 
@@ -167,15 +167,15 @@ export default create({
   },
   emits: [
     'update:visible',
-    'selectSku',
-    'changeStepper',
-    'clickBtnOperate',
-    'clickCloseIcon',
-    'clickOverlay',
+    'select-sku',
+    'change-stepper',
+    'click-btn-operate',
+    'click-close-icon',
+    'click-overlay',
     'close',
     'reduce',
     'add',
-    'overLimit'
+    'over-limit'
   ],
 
   components: {
@@ -211,14 +211,14 @@ export default create({
 
     // 商品规格 sku 选择
     const selectSku = (skus: any) => {
-      emit('selectSku', skus);
+      emit('select-sku', skus);
     };
 
     // 数量计步器变化
     const changeStepper = (value: number) => {
       goodsCount.value = value;
 
-      emit('changeStepper', value);
+      emit('change-stepper', value);
     };
 
     // 修改购买数量 add 加  reduce 减
@@ -232,12 +232,12 @@ export default create({
 
     // 触发极限值
     const stepperOverLimit = (count: any) => {
-      emit('overLimit', count);
+      emit('over-limit', count);
     };
 
     // 点击 button 操作
     const clickBtnOperate = (btn: string) => {
-      emit('clickBtnOperate', {
+      emit('click-btn-operate', {
         type: btn,
         value: goodsCount.value
       });

+ 12 - 13
src/packages/__VUE/sku/index.vue

@@ -62,7 +62,7 @@
   </nut-popup>
 </template>
 <script lang="ts">
-import { ref, watch, onMounted } from 'vue';
+import { ref, watch, onMounted, PropType } from 'vue';
 import SkuHeader from './components/SkuHeader.vue';
 import SkuSelect from './components/SkuSelect.vue';
 import SkuStepper from './components/SkuStepper.vue';
@@ -100,7 +100,7 @@ export default create({
 
     // 底部按钮配置  confirm cart  buy
     btnOptions: {
-      type: Array,
+      type: Array as PropType<string[]>,
       default: () => ['confirm']
     },
 
@@ -141,16 +141,15 @@ export default create({
   },
   emits: [
     'update:visible',
-    'selectSku',
-    'changeStepper',
-    'clickBtnOperate',
-    'clickCloseIcon',
-    'clickOverlay',
+    'select-sku',
+    'change-stepper',
+    'click-btn-operate',
+    'click-close-icon',
+    'click-overlay',
     'close',
     'reduce',
     'add',
-    'overLimit',
-    'clickOverlay'
+    'over-limit'
   ],
 
   components: {
@@ -190,14 +189,14 @@ export default create({
 
     // 商品规格 sku 选择
     const selectSku = (skus: any) => {
-      emit('selectSku', skus);
+      emit('select-sku', skus);
     };
 
     // 数量计步器变化
     const changeStepper = (value: number) => {
       goodsCount.value = value;
 
-      emit('changeStepper', value);
+      emit('change-stepper', value);
     };
 
     // 修改购买数量 add 加  reduce 减
@@ -211,12 +210,12 @@ export default create({
 
     // 触发极限值
     const stepperOverLimit = (count: any) => {
-      emit('overLimit', count);
+      emit('over-limit', count);
     };
 
     // 点击 button 操作
     const clickBtnOperate = (btn: string) => {
-      emit('clickBtnOperate', {
+      emit('click-btn-operate', {
         type: btn,
         value: goodsCount.value
       });