diff --git a/core/core-frontend/src/views/visualized/data/datasource/form/ApiHttpRequestDraw.vue b/core/core-frontend/src/views/visualized/data/datasource/form/ApiHttpRequestDraw.vue
index c0088da9fd..0efc270d36 100644
--- a/core/core-frontend/src/views/visualized/data/datasource/form/ApiHttpRequestDraw.vue
+++ b/core/core-frontend/src/views/visualized/data/datasource/form/ApiHttpRequestDraw.vue
@@ -11,7 +11,7 @@ import EmptyBackground from '@/components/empty-background/src/EmptyBackground.v
 import { checkApiItem } from '@/api/datasource'
 import { cloneDeep } from 'lodash-es'
 import { fieldType } from '@/utils/attr'
-import { ApiConfiguration } from '@/views/visualized/data/datasource/form/index.vue'
+import type { ApiConfiguration } from '@/views/visualized/data/datasource/form/option'
 
 export interface Field {
   name: string
diff --git a/core/core-frontend/src/views/visualized/data/datasource/form/index.vue b/core/core-frontend/src/views/visualized/data/datasource/form/index.vue
index 4d4a2f446f..25ad8f207e 100644
--- a/core/core-frontend/src/views/visualized/data/datasource/form/index.vue
+++ b/core/core-frontend/src/views/visualized/data/datasource/form/index.vue
@@ -11,6 +11,7 @@ import ExcelDetail from './ExcelDetail.vue'
 import { save, update, validate, latestUse, isShowFinishPage, checkRepeat } from '@/api/datasource'
 import { Base64 } from 'js-base64'
 import type { Param } from './ExcelDetail.vue'
+import type { Configuration, ApiConfiguration, SyncSetting } from './option'
 import { dsTypes, typeList, nameMap } from './option'
 import { useRouter } from 'vue-router'
 import { uuid } from 'vue-uuid'
@@ -53,45 +54,6 @@ state.datasourceTree = typeList.map(ele => {
   }
 })
 
-export interface Configuration {
-  dataBase: string
-  connectionType: string
-  schema: string
-  extraParams: string
-  username: string
-  password: string
-  host: string
-  authMethod: string
-  port: string
-  initialPoolSize: string
-  minPoolSize: string
-  maxPoolSize: string
-  queryTimeout: string
-}
-
-export interface ApiConfiguration {
-  id: string
-  name: string
-  deTableName: string
-  method: string
-  url: string
-  status: string
-  useJsonPath: boolean
-  serialNumber: number
-}
-
-export interface SyncSetting {
-  id: string
-  updateType: string
-  syncRate: string
-  simpleCronValue: number
-  simpleCronType: string
-  startTime: number
-  endTime: number
-  endLimit: string
-  cron: string
-}
-
 const activeStep = ref(0)
 const detail = ref()
 const excel = ref()
diff --git a/core/core-frontend/src/views/visualized/data/datasource/form/option.ts b/core/core-frontend/src/views/visualized/data/datasource/form/option.ts
index a5d81cc45d..a8dbaefffe 100644
--- a/core/core-frontend/src/views/visualized/data/datasource/form/option.ts
+++ b/core/core-frontend/src/views/visualized/data/datasource/form/option.ts
@@ -119,3 +119,61 @@ export const nameMap = {
   OTHER: 'API数据',
   LOCAL: t('datasource.local_file')
 }
+
+export interface Configuration {
+  dataBase: string
+  connectionType: string
+  schema: string
+  extraParams: string
+  username: string
+  password: string
+  host: string
+  authMethod: string
+  port: string
+  initialPoolSize: string
+  minPoolSize: string
+  maxPoolSize: string
+  queryTimeout: string
+}
+
+export interface ApiConfiguration {
+  id: string
+  name: string
+  deTableName: string
+  method: string
+  url: string
+  status: string
+  useJsonPath: boolean
+  serialNumber: number
+}
+
+export interface SyncSetting {
+  id: string
+  updateType: string
+  syncRate: string
+  simpleCronValue: number
+  simpleCronType: string
+  startTime: number
+  endTime: number
+  endLimit: string
+  cron: string
+}
+
+export interface Node {
+  name: string
+  createBy: string
+  creator: string
+  createTime: string
+  id: number | string
+  size: number
+  description: string
+  type: string
+  nodeType: string
+  fileName: string
+  syncSetting?: SyncSetting
+  editType?: number
+  configuration?: Configuration
+  apiConfiguration?: ApiConfiguration[]
+  weight?: number
+  lastSyncTime?: number | string
+}
diff --git a/core/core-frontend/src/views/visualized/data/datasource/index.vue b/core/core-frontend/src/views/visualized/data/datasource/index.vue
index 73c9750821..6ce8517c84 100644
--- a/core/core-frontend/src/views/visualized/data/datasource/index.vue
+++ b/core/core-frontend/src/views/visualized/data/datasource/index.vue
@@ -30,7 +30,7 @@ import {
   syncApiTable
 } from '@/api/datasource'
 import { Base64 } from 'js-base64'
-import type { Configuration, ApiConfiguration, SyncSetting } from './form/index.vue'
+import type { SyncSetting, Node } from './form/option'
 import EditorDatasource from './form/index.vue'
 import ExcelInfo from './ExcelInfo.vue'
 import SheetTabs from './SheetTabs.vue'
@@ -49,25 +49,6 @@ interface Field {
   deType: number
 }
 
-export interface Node {
-  name: string
-  createBy: string
-  creator: string
-  createTime: string
-  id: number | string
-  size: number
-  description: string
-  type: string
-  nodeType: string
-  fileName: string
-  syncSetting?: SyncSetting
-  editType?: number
-  configuration?: Configuration
-  apiConfiguration?: ApiConfiguration[]
-  weight?: number
-  lastSyncTime?: number | string
-}
-
 const { t } = useI18n()
 const router = useRouter()
 const appStore = useAppStoreWithOut()
@@ -386,6 +367,7 @@ const saveDsFolder = (params, successCb, finallyCb, cmd) => {
 }
 
 const dsLoading = ref(false)
+const mounted = ref(false)
 
 const listDs = () => {
   rawDatasourceList.value = []
@@ -403,6 +385,7 @@ const listDs = () => {
       state.datasourceTree = nodeData
     })
     .finally(() => {
+      mounted.value = true
       dsLoading.value = false
       updateTreeExpand()
       const id = nodeInfo.id
@@ -794,7 +777,7 @@ const getMenuList = (val: boolean) => {
     </el-aside>
 
     <div class="datasource-content" :class="isDataEaseBi && 'h100'">
-      <template v-if="!state.datasourceTree.length">
+      <template v-if="!state.datasourceTree.length && mounted">
         <empty-background description="暂无数据源" img-type="none">
           <el-button
             v-if="rootManage && !isDataEaseBi"
@@ -1228,7 +1211,7 @@ const getMenuList = (val: boolean) => {
           </BaseInfoContent>
         </template>
       </template>
-      <template v-else>
+      <template v-else-if="mounted">
         <empty-background description="请在左侧选择数据源" img-type="select" />
       </template>
     </div>