diff --git a/src/App.vue b/src/App.vue
index 07cafc9aeda29b9e65368c8941ed09db5cabfa73..383b0db76b807db77b0590309e2cf90504ccfcf7 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -4,12 +4,13 @@ import GameChart from './components/GameChart.vue'
 import SearchGrade from './components/SearchGrade.vue'
 import Draw from './components/draw/Draw.vue'
 import Commit from './components/commit/Commit.vue'
+import Drag from  './components/drag/Drag.vue'
 import { reactive, onBeforeMount,onMounted } from 'vue';
 import html2canvas from 'html2canvas';
 
 // state
 const state = reactive({
-  current: '评论'
+  current: '拖拽'
 })
 
 /** 下载图片 */
@@ -81,6 +82,9 @@ onBeforeMount(() => {
     else if(data['type'] = 'commit'){
       state.current = '评论'
     }
+    else if(data['type'] = 'grag'){
+      state.current = '拖拽'
+    }
   }
 })
 </script>
@@ -93,6 +97,7 @@ onBeforeMount(() => {
                 <a-radio value="新星赛道选手信息可视化">csdn新星赛道可视化</a-radio>
                 <a-radio value="抽奖">随机抽奖</a-radio>
                 <a-radio value="评论">csdn分析评论</a-radio>
+                 <a-radio value="拖拽">拖拽</a-radio>
             </a-radio-group>
             <a-button type="primary" @click="shotAction">
                 截图
@@ -102,6 +107,7 @@ onBeforeMount(() => {
             <SearchGrade v-if="state.current === 'grade查询分数'" />
             <GameChart v-else-if="state.current === '新星赛道选手信息可视化'" />
             <Commit v-else-if="state.current === '评论'" />
+            <Drag v-else-if="state.current === '拖拽'"/>
             <Draw v-else />
         </div>
     </div>
diff --git a/src/components/drag/Drag.vue b/src/components/drag/Drag.vue
new file mode 100644
index 0000000000000000000000000000000000000000..c0366bcfadf638ba30757b40655f26545fcfecd0
--- /dev/null
+++ b/src/components/drag/Drag.vue
@@ -0,0 +1,9 @@
+<template>
+    <div>
+        拖拽
+    </div>
+</template>
+
+<script setup>
+
+</script>
\ No newline at end of file