scroll

src/components/NewsScrollView.tsx

-import { useAsyncState } from "@/common/hooks";
-import { IProps } from "@/common/Iprops.interface";
+import {useAsyncState} from "@/common/hooks";
+import {IProps} from "@/common/Iprops.interface";
 import BScroll from "@better-scroll/core";
-import { BScrollConstructor } from "@better-scroll/core/dist/types/BScroll";
+import {BScrollConstructor} from "@better-scroll/core/dist/types/BScroll";
 import MouseWheel from "@better-scroll/mouse-wheel";
 import ScrollBar from "@better-scroll/scroll-bar";
 import ObserveDOM from '@better-scroll/observe-dom'
 import Pullup from '@better-scroll/pull-up'
-import { ForwardedRef, forwardRef, ForwardRefRenderFunction, useCallback, useEffect, useMemo, useRef, useState } from "react";
+import {
+    ForwardedRef,
+    forwardRef,
+    ForwardRefRenderFunction,
+    useCallback,
+    useEffect,
+    useMemo,
+    useRef,
+    useState
+} from "react";
+
 interface ScrollViewType extends IProps {
     wrapHeight?: string;
     prop?: any;
 }
 
-const initBScroll = (el:HTMLElement) => {
+const initBScroll = (el: HTMLElement) => {
     const res = new BScroll(el, {
         click: true,
         mouseWheel: {
@@ -21,12 +31,13 @@ const initBScroll = (el:HTMLElement) => {
             easeTime: 300,
         },
         pullUpLoad: {
-        threshold: 200
+            threshold: 100
         },
         observeDOM: true,
-      probeType:2,
+        probeType: 2,
+
         //  显示滚动条,
-    useTransition:true,
+        useTransition: true,
         scrollX: false,
         momentum: true,
         scrollY: true,
@@ -41,21 +52,26 @@ export const NewsScrollView = (props: ScrollViewType) => {
     BScroll.use(MouseWheel);
     BScroll.use(Pullup)
     BScroll.use(ObserveDOM);
-  const { wrapHeight, children } = props;
+    const {wrapHeight, children} = props;
     const wrapRef = useRef<HTMLDivElement>(null);
     const [scrollObj, setScrollObj] = useState<BScrollConstructor<{}>>();
 
-  useEffect(()=>{
+    useEffect(() => {
         const scrollEl = initBScroll(wrapRef.current as HTMLDivElement)
+        // scrollEl.minScrollY=0
         setScrollObj(scrollEl)
+        // scrollEl.on('scroll',()=>{
+        //     scrollEl.minScrollY=0
+        // })
         return () => {
             scrollObj?.destroy();
         };
-  },[wrapRef])
+    }, [wrapRef])
+
 
     return (
 
-      <div className=" h-full overflow-hidden pb-5 -translate-x-[200px]"  ref={wrapRef}>
+        <div className=" h-full overflow-hidden pb-5 ml-[-200px]"  ref={wrapRef}>
 
             {children}
 

src/views/News/index.tsx

@@ -60,7 +60,7 @@ export default function News(props: IAppProps) {
             </div>
           </div>
         </div>
-        <div className="right h-full pt-28 w-7/12 relative">
+        <div className="right h-full pt-28 w-7/12 relative" style={{boxSizing:"border-box"}}>
           <NewsScrollView>
             <div className='mb-12 pb-[200px]'>
               <ul className="news-list -translate-x-[25px]">