37 lines
1.3 KiB
TypeScript
37 lines
1.3 KiB
TypeScript
import { MovableArea, MovableView, View } from "@tarojs/components"
|
|
import Taro, { useReady } from "@tarojs/taro"
|
|
import { ReactElement, useEffect, useRef, useState } from "react"
|
|
import classnames from "classnames";
|
|
import styles from './index.module.scss'
|
|
|
|
type param = {
|
|
children?: ReactElement|null,
|
|
onClick?: () => void
|
|
}
|
|
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
|
|
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="750rpx" y={screenHeight+'rpx'} onTouchEnd={(e) => dragEnd(e)}>
|
|
<View className={classnames('iconfont','icon-gouwuche', styles.shop_icon) } ></View>
|
|
</MovableView>}
|
|
</MovableArea>
|
|
)
|
|
} |