فهرست منبع

use js event toemit scroll

yohei0125 4 سال پیش
والد
کامیت
c0f060d95c

+ 0 - 1
packages/app/src/client/services/ContextExtractor.tsx

@@ -139,7 +139,6 @@ const ContextExtractorOnce: FC = () => {
 
   // SearchResult
   useIsDeviceSmallerThanLg();
-  useIsRevisionBodyRendered(false);
 
   return null;
 };

+ 3 - 31
packages/app/src/components/Page/RevisionBody.jsx

@@ -2,9 +2,8 @@ import React from 'react';
 import PropTypes from 'prop-types';
 
 import { debounce } from 'throttle-debounce';
-import { useIsRevisionBodyRendered } from '~/stores/context';
 
-class RevisionBody extends React.PureComponent {
+export default class RevisionBody extends React.PureComponent {
 
   constructor(props) {
     super(props);
@@ -25,15 +24,8 @@ class RevisionBody extends React.PureComponent {
     if (MathJax != null && this.props.isMathJaxEnabled && this.props.renderMathJaxInRealtime) {
       this.renderMathJaxWithDebounce();
     }
-    if (this.props.onRevisionBodyRendered && !this.props.isRevisionBodyRendered) {
-      this.props.onRevisionBodyRendered();
-    }
-  }
-
-  componentWillUnmount() {
-    if (this.props.onRivisionBodyWillUnmount && this.props.isRevisionBodyRendered) {
-      this.props.onRivisionBodyWillUnmount();
-    }
+    const event = new CustomEvent('isRevisionBodyRendered');
+    document.dispatchEvent(event);
   }
 
   componentWillReceiveProps(nextProps) {
@@ -92,24 +84,4 @@ RevisionBody.propTypes = {
   additionalClassName: PropTypes.string,
   onRevisionBodyRendered: PropTypes.func,
   onRivisionBodyWillUnmount: PropTypes.func,
-  isRevisionBodyRendered: PropTypes.bool,
-};
-
-export default (props) => {
-  const { mutate, data: isRevisionBodyRendered } = useIsRevisionBodyRendered();
-  const mutateOnComponentDidUpdate = () => {
-    mutate(true);
-  };
-  const mutateOnComponentWillUnmount = () => {
-    mutate(false);
-  };
-  return (
-    <RevisionBody
-      {...props}
-      onRevisionBodyRendered={mutateOnComponentDidUpdate}
-      onRivisionBodyWillUnmount={mutateOnComponentWillUnmount}
-      isRevisionBodyRendered={isRevisionBodyRendered}
-    >
-    </RevisionBody>
-  );
 };

+ 9 - 9
packages/app/src/components/SearchPage/SearchResultContent.tsx

@@ -25,17 +25,17 @@ type Props ={
 const SearchResultContent: FC<Props> = (props: Props) => {
   const contentRef = useRef(null);
 
-  const { data: isRevisionBodyRendered } = useIsRevisionBodyRendered();
-
   useEffect(() => {
-    if (isRevisionBodyRendered && contentRef.current != null) {
-      const scrollTargetElement = contentRef.current as HTMLElement;
-      const highlightedKeyword = scrollTargetElement.querySelector('.highlighted-keyword') as HTMLElement;
-      if (highlightedKeyword) {
-        smoothScrollIntoView(highlightedKeyword, SCROLL_OFFSET_TOP, scrollTargetElement);
+    document.addEventListener('isRevisionBodyRendered', (e) => {
+      if (contentRef.current != null) {
+        const scrollTargetElement = contentRef.current as HTMLElement;
+        const highlightedKeyword = scrollTargetElement.querySelector('.highlighted-keyword') as HTMLElement;
+        if (highlightedKeyword) {
+          smoothScrollIntoView(highlightedKeyword, SCROLL_OFFSET_TOP, scrollTargetElement);
+        }
       }
-    }
-  }, [isRevisionBodyRendered]);
+    });
+  }, []);
 
   const page = props.focusedSearchResultData?.pageData;
 

+ 0 - 4
packages/app/src/stores/context.tsx

@@ -131,10 +131,6 @@ export const useNotFoundTargetPathOrId = (initialData?: Nullable<NotFoundTargetP
   return useStaticSWR<Nullable<NotFoundTargetPathOrId>, Error>('notFoundTargetPathOrId', initialData);
 };
 
-export const useIsRevisionBodyRendered = (initialData?: boolean): SWRResponse<Nullable<boolean>, Error> => {
-  return useStaticSWR<Nullable<boolean>, Error>('isRevisionBodyRendered', initialData);
-};
-
 
 /** **********************************************************
  *                     Computed contexts