ソースを参照

feat(elevator): 暴露 ScrollTo API

suzigang 4 年 前
コミット
cfd19a1110

+ 4 - 0
src/packages/__VUE/elevator/doc.md

@@ -245,4 +245,8 @@ app.use(Elevator);
 | click-item | 点击内容 | key: string, item: { id: 0, name: '' } |
 | click-index | 点击索引 | key: string |
 
+### API
 
+| 事件名           | 说明                   | 参数           |
+| ---------------- | ---------------------- | ------------ |
+| scrollTo         | 滚动到对应索引的位置       | index:number |

+ 5 - 0
src/packages/__VUE/elevator/index.taro.vue

@@ -43,6 +43,7 @@
 <script lang="ts">
 import { computed, reactive, toRefs, nextTick, ref, Ref, onMounted } from 'vue';
 import { createComponent } from '../../utils/create';
+import { useExpose } from '../../utils/useExpose/index';
 const { componentName, create } = createComponent('elevator');
 import Taro, { eventCenter, getCurrentInstance } from '@tarojs/taro';
 interface ElevatorData {
@@ -191,6 +192,10 @@ export default create({
       }
     });
 
+    useExpose({
+      scrollTo
+    });
+
     return {
       classes,
       ...toRefs(state),

+ 5 - 1
src/packages/__VUE/elevator/index.vue

@@ -32,6 +32,7 @@
 <script lang="ts">
 import { computed, reactive, toRefs, nextTick, ref, Ref } from 'vue';
 import { createComponent } from '../../utils/create';
+import { useExpose } from '../../utils/useExpose/index';
 const { componentName, create } = createComponent('elevator');
 interface ElevatorData {
   name: string;
@@ -134,7 +135,6 @@ export default create({
       state.touchState.y1 = firstTouch.pageY;
       state.anchorIndex = +index;
       state.currentIndex = +index;
-      // console.log(state.currentIndex);
       scrollTo(+index);
     };
 
@@ -158,6 +158,10 @@ export default create({
       context.emit('click-index', key);
     };
 
+    useExpose({
+      scrollTo
+    });
+
     return {
       classes,
       ...toRefs(state),

+ 0 - 8
src/packages/__VUE/swiper/use-expose.ts

@@ -1,8 +0,0 @@
-import { getCurrentInstance } from 'vue';
-
-export function useExpose(apis: Record<string, any>) {
-  const instance = getCurrentInstance();
-  if (instance) {
-    Object.assign(instance.proxy, apis);
-  }
-}

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

@@ -7,7 +7,7 @@
 <script lang="ts">
 import { computed, reactive, inject, getCurrentInstance, watch } from 'vue';
 import { createComponent } from '../../utils/create';
-import { useExpose } from '../swiper/use-expose';
+import { useExpose } from '../../utils/useExpose/index';
 const { create, componentName } = createComponent('swiper-item');
 interface IStyle {
   width?: string;

+ 3 - 7
src/packages/__VUE/swiperitem/index.vue

@@ -7,7 +7,7 @@
 <script lang="ts">
 import { computed, reactive, inject, getCurrentInstance, watch } from 'vue';
 import { createComponent } from '../../utils/create';
-import { useExpose } from '../swiper/use-expose';
+import { useExpose } from '../../utils/useExpose/index';
 const { create, componentName } = createComponent('swiper-item');
 interface IStyle {
   width?: string;
@@ -34,15 +34,11 @@ export default create({
       const style: IStyle = {};
       const direction = parent?.props.direction;
       if (parent?.size.value) {
-        style[
-          direction === 'horizontal' ? 'width' : 'height'
-        ] = `${parent?.size.value}px`;
+        style[direction === 'horizontal' ? 'width' : 'height'] = `${parent?.size.value}px`;
       }
 
       if (state.offset) {
-        style['transform'] = `translate${
-          direction === 'horizontal' ? 'X' : 'Y'
-        }(${state.offset}px)`;
+        style['transform'] = `translate${direction === 'horizontal' ? 'X' : 'Y'}(${state.offset}px)`;
       }
 
       return style;