页面

src/components/moveBtn/index.tsx

@@ -1,6 +1,6 @@
 import { MovableArea, MovableView, View } from "@tarojs/components"
 import Taro, { useReady } from "@tarojs/taro"
-import { ReactElement, useState } from "react"
+import { ReactElement, useEffect, useRef, useState } from "react"
 import classnames from "classnames";
 import styles  from './index.module.scss'
 
@@ -11,18 +11,25 @@ type param = {
 export default ({children = null, onClick}:param) => {
     const [screenHeight, setScreenHeight] = useState(0)
     const [showMoveBtn, setShowMoveBtn] = useState(false)
+    const screenWidthRef = useRef(0)
     useReady(() => {
         const res = Taro.getSystemInfoSync()
         if(res.screenHeight) {
-            let ratio = 750 / res.screenWidth;
+            let ratio = 750 / res.screenWidth
             setScreenHeight(res.screenHeight*ratio - 460)
+            screenWidthRef.current = res.screenWidth/2
         }
         setShowMoveBtn(true)
     })
+
+    const dragEnd = (e) => {
+
+    }
+
     return (
         <MovableArea className={styles.movableItem}>
             {children}
-            {showMoveBtn&&<MovableView onClick={onClick} className={styles.moveBtn} direction="all" inertia={true} x='650rpx' y={screenHeight+'rpx'}>
+            {showMoveBtn&&<MovableView onClick={onClick} className={styles.moveBtn} direction="all" inertia={true} x="750rpx" y={screenHeight+'rpx'} onTouchEnd={(e) => dragEnd(e)}>
               <View className={classnames('iconfont','icon-gouwuche', styles.shop_icon) } ></View>
             </MovableView>}
         </MovableArea>