diff --git a/components/canvas/nodes/ImageNode.tsx b/components/canvas/nodes/ImageNode.tsx index a6603edf4..ce2af1e87 100644 --- a/components/canvas/nodes/ImageNode.tsx +++ b/components/canvas/nodes/ImageNode.tsx @@ -1,6 +1,6 @@ "use client"; -import React, { useState } from "react"; +import React, { useState, useRef } from "react"; import { ImagePlus, Loader2, AlertCircle, MoreVertical, Scissors, Sparkles, Expand, Maximize2, Move3D, Layers, Download, Trash2, RefreshCw } from "lucide-react"; import { Button } from "@/components/ui/button"; import { @@ -29,12 +29,21 @@ export function ImageNode({ node, isSelected }: ImageNodeProps) { const [isProcessing, setIsProcessing] = useState(false); const [angleDialogOpen, setAngleDialogOpen] = useState(false); const [sceneFusionDialogOpen, setSceneFusionDialogOpen] = useState(false); + const [isUploading, setIsUploading] = useState(false); + + // 文件输入的 ref + const fileInputRef = useRef(null); const updateNode = useCanvasStore((state) => state.updateNode); const deleteNode = useCanvasStore((state) => state.deleteNode); const addNode = useCanvasStore((state) => state.addNode); - const [isUploading, setIsUploading] = useState(false); + // 触发文件选择 + const handleSelectFile = (e: React.MouseEvent) => { + e.preventDefault(); + e.stopPropagation(); + fileInputRef.current?.click(); + }; // 处理图片上传 - 上传到存储桶,不使用 Base64 const handleImageUpload = async (e: React.ChangeEvent) => { @@ -224,20 +233,22 @@ export function ImageNode({ node, isSelected }: ImageNodeProps) {
点击上传图片 -
)}