diff --git a/src/packages/backtop/backtop.taro.tsx b/src/packages/backtop/backtop.taro.tsx index 67783aa8f..975c812b0 100644 --- a/src/packages/backtop/backtop.taro.tsx +++ b/src/packages/backtop/backtop.taro.tsx @@ -1,4 +1,4 @@ -import React, { FunctionComponent, useState } from 'react' +import React, { FunctionComponent, useState, useCallback } from 'react' import type { MouseEvent } from 'react' import { usePageScroll, pageScrollTo } from '@tarojs/taro' import { Top } from '@nutui/icons-react-taro' @@ -29,14 +29,17 @@ export const BackTop: FunctionComponent< ...props, } const classPrefix = 'nut-backtop' - const [backTop, SetBackTop] = useState(false) + const [backTop, setBackTop] = useState(false) const cls = classNames(classPrefix, { show: backTop }, className) // 监听用户滑动页面事件 - usePageScroll((res) => { - const { scrollTop } = res - scrollTop >= threshold ? SetBackTop(true) : SetBackTop(false) - }) - // 返回顶部点击事件 + const handleScroll = useCallback( + (res: { scrollTop: number }) => { + const { scrollTop } = res + setBackTop(scrollTop >= threshold) + }, + [threshold] + ) + usePageScroll(handleScroll) const goTop = (e: MouseEvent) => { onClick && onClick(e) pageScrollTo({ diff --git a/src/packages/menu/menu.taro.tsx b/src/packages/menu/menu.taro.tsx index c6973c76c..d2251d3c3 100644 --- a/src/packages/menu/menu.taro.tsx +++ b/src/packages/menu/menu.taro.tsx @@ -67,7 +67,10 @@ export const Menu: FunctionComponent> & { }) const getScrollTop = (el: Element | Window) => { - return Math.max(0, 'scrollTop' in el ? el.scrollTop : el.scrollY) + return Math.max( + 0, + el === window ? window.scrollY : (el as Element).scrollTop + ) } const onScroll = useCallback(() => { const scrollTop = getScrollTop(window)