diff --git a/packages/extension/src/browser/components/extension-tree-view.tsx b/packages/extension/src/browser/components/extension-tree-view.tsx index c6ea6f8ada..379c60050d 100644 --- a/packages/extension/src/browser/components/extension-tree-view.tsx +++ b/packages/extension/src/browser/components/extension-tree-view.tsx @@ -9,7 +9,7 @@ import React, { useCallback, useEffect, useMemo, - useState, + useRef, } from 'react'; import { Injector } from '@opensumi/di'; @@ -38,8 +38,8 @@ export interface ExtensionTabBarTreeViewProps { export const ExtensionTabBarTreeView = observer( ({ viewState, model, dataProvider, treeViewId }: PropsWithChildren) => { - const [isReady, setIsReady] = useState(false); - const [isEmpty, setIsEmpty] = useState(dataProvider.isTreeEmpty); + const isReady = useRef(false); + const isEmpty = useRef(dataProvider.isTreeEmpty); const layoutService = useInjectable(IMainLayoutService); const decorationService = useInjectable(IDecorationsService); const accordionService = useMemo(() => layoutService.getViewAccordionService(treeViewId), []); @@ -54,7 +54,7 @@ export const ExtensionTabBarTreeView = observer( useEffect(() => { const disposable = dataProvider.onDidChangeEmpty(() => { - setIsEmpty(dataProvider.isTreeEmpty); + isEmpty.current = dataProvider.isTreeEmpty; }); return () => disposable.dispose(); }, []); @@ -193,7 +193,7 @@ export const ExtensionTabBarTreeView = observer( await model.treeModel.ensureReady; } if (!unmouted) { - setIsReady(true); + isReady.current = true; } })(); return () => { @@ -222,8 +222,8 @@ export const ExtensionTabBarTreeView = observer( data-tree-view-id={treeViewId} > ) => { - const [isReady, setIsReady] = useState(false); - const [isLoading, setIsLoading] = useState(true); + const isReady = useRef(false); + const isLoading = useRef(true); const [outerActive, setOuterActive] = useState(false); const [outerDragOver, setOuterDragOver] = useState(false); const [model, setModel] = useState(); @@ -142,13 +142,13 @@ export const FileTree = ({ viewState }: PropsWithChildren<{ viewState: ViewState // 首次初始化完成时,监听后续变化,适配工作区变化事件 // 监听工作区变化 fileTreeModelService.onFileTreeModelChange(async (treeModel) => { - setIsLoading(true); + isLoading.current = true; if (treeModel) { // 确保数据初始化完毕,减少初始化数据过程中多次刷新视图 await treeModel.ensureReady; } + isLoading.current = false; setModel(treeModel); - setIsLoading(false); }); } }, [isReady]); @@ -264,27 +264,28 @@ export const FileTree = ({ viewState }: PropsWithChildren<{ viewState: ViewState const ensureIsReady = useCallback( async (token: CancellationToken) => { + isReady.current = false; await fileTreeModelService.whenReady; if (token.isCancellationRequested) { return; } + // 文件服务已经初始化完毕,但文件树数据仍需要加载 + isReady.current = true; if (fileTreeModelService.treeModel) { // 确保数据初始化完毕,减少初始化数据过程中多次刷新视图 await fileTreeModelService.treeModel.ensureReady; - setModel(fileTreeModelService.treeModel); if (token.isCancellationRequested) { return; } + setModel(fileTreeModelService.treeModel); + // 文件树数据加载完毕 + isLoading.current = false; if (wrapperRef.current) { fileTreeService.initContextKey(wrapperRef.current); } } - setIsLoading(false); - if (!disposableRef.current?.disposed) { - setIsReady(true); - } }, - [fileTreeModelService, disposableRef.current], + [fileTreeModelService], ); const handleTreeReady = useCallback( @@ -365,8 +366,8 @@ export const FileTree = ({ viewState }: PropsWithChildren<{ viewState: ViewState onDrop={handleOuterDrop} > = observer(({ height }) => { - const [isReady, setIsReady] = useState(false); + const isReady = useRef(false); const [model, setModel] = useState(); const wrapperRef: RefObject = createRef(); @@ -39,7 +39,7 @@ export const SCMResourceTree: FC<{ // 这里需要重新取一下treeModel的值确保为最新的TreeModel await scmTreeModelService.treeModel.ensureReady; } - setIsReady(true); + isReady.current = true; })(); }, []); @@ -142,7 +142,7 @@ export const SCMResourceTree: FC<{ data-name={TREE_FIELD_NAME} >