diff --git a/src/api/mock/index.ts b/src/api/mock/index.ts
index 413be00c..52f669b9 100644
--- a/src/api/mock/index.ts
+++ b/src/api/mock/index.ts
@@ -14,6 +14,7 @@ export const scrollBoardUrl = '/mock/scrollBoard'
 export const radarUrl = '/mock/radarData'
 export const heatMapUrl = '/mock/heatMapData'
 export const scatterBasicUrl = '/mock/scatterBasic'
+export const wordCloudUrl = '/mock/wordCloud'
 
 const mockObject: MockMethod[] = [
   {
@@ -73,6 +74,11 @@ const mockObject: MockMethod[] = [
     method: RequestHttpEnum.GET,
     response: () => test.fetchScatterBasic
   },
+  {
+    url: wordCloudUrl,
+    method: RequestHttpEnum.GET,
+    response: () => test.fetchWordCloud
+  }
 ]
 
 export default mockObject
diff --git a/src/api/mock/test.mock.ts b/src/api/mock/test.mock.ts
index b2a4079a..57e81564 100644
--- a/src/api/mock/test.mock.ts
+++ b/src/api/mock/test.mock.ts
@@ -198,5 +198,44 @@ export default {
     status: 200,
     msg: '请求成功',
     data: scatterJson
+  },
+  // 词云
+  fetchWordCloud: {
+    code: 0,
+    status: 200,
+    msg: '请求成功',
+    data: [
+      {
+        name: '@name',
+        value: 8000,
+        textStyle: {
+          color: '#78fbb2'
+        },
+        emphasis: {
+          textStyle: {
+            color: 'red'
+          }
+        }
+      },
+      { name: '@name', value: '@integer(10, 8000)' },
+      { name: '@name', value: '@integer(10, 8000)' },
+      { name: '@name', value: '@integer(10, 8000)' },
+      { name: '@name', value: '@integer(10, 8000)' },
+      { name: '@name', value: '@integer(10, 8000)' },
+      { name: '@name', value: '@integer(10, 8000)' },
+      { name: '@name', value: '@integer(10, 8000)' },
+      { name: '@name', value: '@integer(10, 8000)' },
+      { name: '@name', value: '@integer(10, 8000)' },
+      { name: '@name', value: '@integer(10, 8000)' },
+      { name: '@name', value: '@integer(10, 8000)' },
+      { name: '@name', value: '@integer(10, 8000)' },
+      { name: '@name', value: '@integer(10, 8000)' },
+      { name: '@name', value: '@integer(10, 8000)' },
+      { name: '@name', value: '@integer(10, 8000)' },
+      { name: '@name', value: '@integer(10, 8000)' },
+      { name: '@name', value: '@integer(10, 8000)' },
+      { name: '@name', value: '@integer(10, 8000)' },
+      { name: '@name', value: '@integer(10, 8000)' }
+    ]
   }
 }
diff --git a/src/packages/components/Informations/Mores/WordCloud/index.vue b/src/packages/components/Informations/Mores/WordCloud/index.vue
index a483dce9..902483dd 100644
--- a/src/packages/components/Informations/Mores/WordCloud/index.vue
+++ b/src/packages/components/Informations/Mores/WordCloud/index.vue
@@ -23,6 +23,7 @@ import { useChartDataFetch } from '@/hooks'
 import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
 import { isPreview } from '@/utils'
 import { DatasetComponent, GridComponent, TooltipComponent, LegendComponent } from 'echarts/components'
+import dataJson from './data.json'
 
 const props = defineProps({
   themeSetting: {
@@ -47,17 +48,25 @@ const option = computed(() => {
   return mergeTheme(props.chartConfig.option, props.themeSetting, includes)
 })
 
+const dataSetHandle = (dataset: typeof dataJson) => {
+  // eslint-disable-next-line vue/no-mutating-props
+  dataset && (props.chartConfig.option.series[0].data = dataset)
+
+  vChartRef.value && isPreview() && vChartRef.value.setOption(props.chartConfig.option)
+}
+
 // dataset 无法变更条数的补丁
 watch(
   () => props.chartConfig.option.dataset,
   newData => {
-    // eslint-disable-next-line vue/no-mutating-props
-    props.chartConfig.option.series[0].data = newData
+    dataSetHandle(newData)
   },
   {
     deep: false
   }
 )
 
-const { vChartRef } = useChartDataFetch(props.chartConfig, useChartEditStore)
+const { vChartRef } = useChartDataFetch(props.chartConfig, useChartEditStore, (newData: typeof dataJson) => {
+  dataSetHandle(newData)
+})
 </script>