YourSelfHosted/memos
1
0
Fork 0
mirror of https://github.com/usememos/memos.git synced 2025-06-05 22:09:59 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix: avoid content flash on auto collapse (#2042)

Browse Source
This commit is contained in:
Gerald
2023-07-29 09:04:34 +08:00
committed by GitHub
parent 95675cdf07
commit 28aecd86d3
1 changed files with 5 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
web/src/components/MemoContent.tsx
View File

@ -30,22 +30,22 @@ const MemoContent: React.FC<Props> = (props: Props) => {
}); });
const memoContentContainerRef = useRef<HTMLDivElement>(null); const memoContentContainerRef = useRef<HTMLDivElement>(null);
const isVisitorMode = userStore.isVisitorMode(); const isVisitorMode = userStore.isVisitorMode();
const autoCollapse: boolean = isVisitorMode ? true : (userStore.state.user as User).localSetting.enableAutoCollapse; const autoCollapse: boolean = !showFull && (isVisitorMode ? true : (userStore.state.user as User).localSetting.enableAutoCollapse);
useEffect(() => { useEffect(() => {
if (showFull) { if (!autoCollapse) {
return; return;
} }
if (memoContentContainerRef.current) { if (memoContentContainerRef.current) {
const height = memoContentContainerRef.current.clientHeight; const height = memoContentContainerRef.current.scrollHeight;
if (height > MAX_EXPAND_HEIGHT) { if (height > MAX_EXPAND_HEIGHT) {
setState({ setState({
expandButtonStatus: 0, expandButtonStatus: 0,
}); });
} }
} }
}, []); }, [autoCollapse]);
const handleMemoContentClick = async (e: React.MouseEvent) => { const handleMemoContentClick = async (e: React.MouseEvent) => {
if (onMemoContentClick) { if (onMemoContentClick) {
@ -70,7 +70,7 @@ const MemoContent: React.FC<Props> = (props: Props) => {
<div className={`memo-content-wrapper ${className || ""}`}> <div className={`memo-content-wrapper ${className || ""}`}>
<div <div
ref={memoContentContainerRef} ref={memoContentContainerRef}
className={`memo-content-text ${autoCollapse && state.expandButtonStatus === 0 ? "max-h-64 overflow-y-hidden" : ""}`} className={`memo-content-text ${autoCollapse && state.expandButtonStatus < 1 ? "max-h-64 overflow-y-hidden" : ""}`}
onClick={handleMemoContentClick} onClick={handleMemoContentClick}
onDoubleClick={handleMemoContentDoubleClick} onDoubleClick={handleMemoContentDoubleClick}
> >