diff --git a/components/ArticleDetail.js b/components/ArticleDetail.js index 66245caa..6ef528fe 100644 --- a/components/ArticleDetail.js +++ b/components/ArticleDetail.js @@ -19,7 +19,7 @@ import 'prismjs/components/prism-javascript' import 'prismjs/components/prism-markup' import 'prismjs/components/prism-python' import 'prismjs/components/prism-typescript' -import { useRef } from 'react' +import { useEffect, useRef } from 'react' import { Code, Collection, CollectionRow, Equation, NotionRenderer } from 'react-notion-x' import ArticleCopyright from './ArticleCopyright' import Live2D from './Live2D' @@ -43,26 +43,40 @@ export default function ArticleDetail ({ post, blockMap, recommendPosts, prev, n margin: getMediumZoomMargin() }) const zoomRef = useRef(zoom ? zoom.clone() : null) - function attachZoom (image) { - if (zoomRef.current) { - (zoomRef.current).attach(image) + + useEffect(() => { + // 将所有container下的所有图片添加medium-zoom + const container = document.getElementById('container') + const imgList = container.getElementsByTagName('img') + if (imgList && zoomRef.current) { + for (let i = 0; i < imgList.length; i++) { + (zoomRef.current).attach(imgList[i]) + } } - } - const attachZoomRef = attachZoom + }) return (<> -