diff --git a/demos/vue/src/App.vue b/demos/vue/src/App.vue
index 4e996d1e0656a1c663cfd9212cd207919f96ca8a..027ea5d818a0ad2964776aebe2a765275c5d818a 100644
--- a/demos/vue/src/App.vue
+++ b/demos/vue/src/App.vue
@@ -4,6 +4,7 @@
             :className="'custom-class'"
             :style="{ width: '100%', height: '100%' }"
             :data="initialData"
+            :provider="provider"
         />
     </div>
 </template>
@@ -12,6 +13,15 @@
 import { Tinyflow } from '@tinyflow-ai/vue';
 import { ref } from 'vue';
 
+const provider = {
+    llm: ()  => [
+        {
+            value: 'llm',
+            label: 'llm',
+        }
+    ],
+    knowledge: () => []
+}
 const initialData = ref({
     nodes: [],
     edges: []
diff --git a/packages/vue/src/Tinyflow.vue b/packages/vue/src/Tinyflow.vue
index 62ede63707a3292eecac796b582dd6c5e9a00b3b..40746a4c2b972eb74155a5e9f73b62e07125a043 100644
--- a/packages/vue/src/Tinyflow.vue
+++ b/packages/vue/src/Tinyflow.vue
@@ -3,7 +3,7 @@
 </template>
 
 <script setup lang="ts">
-import { Tinyflow as TinyflowNative } from '@tinyflow-ai/ui';
+import { Item, Tinyflow as TinyflowNative } from '@tinyflow-ai/ui';
 import '@tinyflow-ai/ui/dist/index.css';
 import { onMounted, onUnmounted, ref } from 'vue';
 
@@ -11,16 +11,31 @@ const props = defineProps<{
     className?: string;
     style?: Record<string, string>;
     data?: Record<string, any>;
+    provider?: {
+        llm?: () => Item[] | Promise<Item[]>;
+        knowledge?: () => Item[] | Promise<Item[]>;
+    };
 }>();
 
 const divRef = ref<HTMLDivElement | null>(null);
 let tinyflow: TinyflowNative | null = null;
+// 定义默认的 provider 方法
+const defaultProvider = {
+    llm: () => [] as Item[],
+    knowledge: () => [] as Item[],
+};
 
 onMounted(() => {
     if (divRef.value) {
+        // 合并默认 provider 和传入的 props.provider
+        const mergedProvider = {
+            ...defaultProvider,
+            ...props.provider,
+        };
         tinyflow = new TinyflowNative({
             element: divRef.value as Element,
-            data: props.data || {}
+            data: props.data || {},
+            provider: mergedProvider,
         });
     }
 });