# FileExplorer

**Repository Path**: wh_wh/FileExplorer

## Basic Information

- **Project Name**: FileExplorer
- **Description**: 一个基于 Vue 3 + TypeScript + Element Plus 构建的仿 Windows 文件资源管理器应用。
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 0
- **Created**: 2025-07-11
- **Last Updated**: 2025-07-12

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 文件资源管理器

一个现代化、高性能的 Windows 11 风格文件资源管理器，使用 Vue 3 + TypeScript + Element Plus 构建。

## 📸 项目截图

### 主界面预览

![主界面](./public/screenshot/home.png)

### 文件列表视图

![列表视图](./public/screenshot/screenshot_2025-07-12_10-03-05.png)

### 卡片列表视图

![卡片视图](./public/screenshot/screenshot_2025-07-12_10-02-51.png)

### 空页面

![右键菜单](./public/screenshot/screenshot_2025-07-12_10-03-23.png)

### 🚀 当前架构

**核心组件**：

- `VirtualFileListV2.vue` - 高性能虚拟滚动列表
- `Toolbar.vue` - 简化的工具栏（包含一键修复功能）
- `FileGrid.vue` - 文件显示网格

这是一个干净、高性能的文件资源管理器，具备企业级的性能和简洁的代码结构。

## ✨ 核心功能

- 🔍 **多视图模式** - 列表视图/网格视图自由切换
- 🖱️ **智能右键菜单** - 带微动画效果，支持文件和空白区域操作
- 📋 **完整文件操作** - 剪切、复制、粘贴、删除、重命名
- ⌨️ **全键盘快捷键** - Windows 标准快捷键支持
  - `Ctrl+C` - 复制文件
  - `Ctrl+X` - 剪切文件
  - `Ctrl+V` - 粘贴文件
  - `Delete` - 删除文件
  - `F2` - 重命名文件
  - `Enter` - 打开文件/文件夹
  - `Escape` - 取消选中
  - `Alt+←/→` - 前进/后退
  - `Alt+↑` - 上级目录
  - `Ctrl+R/F5` - 刷新
- � **虚拟滚动** - 大文件列表高性能渲染
- 🎭 **智能图标** - 文件类型自动识别
- �🖱️ **拖拽支持** - 文件图标可拖拽操作
- 📂 **友好提示** - 空文件夹状态提示
- 🏠 **快速访问** - 桌面、下载、文档等常用位置
- 💾 **驱动器管理** - 系统驱动器快速访问

## 🎨 用户体验

- **流畅动画** - 使用 animate.css 提供微动画效果
- **无闪烁菜单** - 右键菜单状态稳定，无内容切换闪烁
- **响应式设计** - 适配不同屏幕尺寸
- **Windows 11 风格** - 现代化 UI 设计语言

## 技术栈

- **Vue 3** - 渐进式JavaScript框架，Composition API
- **TypeScript** - 静态类型检查，提升代码质量
- **Element Plus** - Vue 3 组件库，丰富的UI组件
- **Animate.css** - 轻量级CSS动画库
- **Vite** - 现代化构建工具，快速热重载
- **Pinia** - Vue 3 状态管理库
- **SCSS** - CSS预处理器，模块化样式

## 快速开始

### 安装依赖

```bash
npm install
```

### 开发运行

```bash
npm run dev
```

### 构建生产版本

```bash
npm run build
```

## 🏗️ 项目架构亮点

### 高性能设计

- **虚拟滚动技术** - 处理大量文件列表无性能瓶颈
- **状态管理优化** - 使用 Pinia 进行全局状态管理
- **组件懒加载** - 按需加载，减少初始包体积

### 代码质量

- **TypeScript 严格模式** - 100% 类型覆盖，编译时错误检查
- **组件化设计** - 高内聚低耦合，易于维护和扩展
- **Hooks 模式** - 逻辑复用，代码简洁

### 用户体验优化

- **右键菜单防闪烁** - 多层保护机制确保菜单状态稳定
- **智能动画系统** - 基于 animate.css 的微动画效果
- **键盘友好** - 完整的快捷键支持，无障碍访问

## 📝 开发说明

该项目采用现代化的 Vue 3 + TypeScript 技术栈，注重代码质量和用户体验。所有组件都经过精心设计和优化，确保在处理大量文件时仍能保持流畅的性能。

核心技术特色：

- 虚拟滚动解决大列表性能问题
- 稳定的右键菜单交互系统
- 完整的文件操作功能模拟
- 响应式设计适配多种屏幕

## 🤝 贡献指南

欢迎提交 Issue 和 Pull Request！

## 📄 许可证

MIT License