uni-app实现文件管理器（Android）

╰半夏微凉° 2023-01-03 04:13 690阅读 0赞

### 提示： ###

> 1. 仅适用于安卓
> 
> 2. 若文件较多，打开会比较慢，可以自行优化

## 功能： ##

> 1. 文件列表页(/pages/index/index) - 展示从已选择添加的文件
> 
> 2. 添加文件页(/pages/directory/directory) - 点击文件列表页右上角 +， 进入该页面，扫描本地根目录所有文件
> 
> 3. 选择文件功能(/pages/directory/directory) - 用户可以选择多个文件，点击确定，确认添加文件，返回文件列表页
> 
> 4. 记住上次打开目录功能(/pages/directory/directory) - 当用户在添加文件页点击了确定之后，同时会记住当前目录的路径
> 
> 5. 解析文件内容并展示(/pages/detail/detail)

### 效果： ###

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L01fRXZl_size_16_color_FFFFFF_t_70][] ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L01fRXZl_size_16_color_FFFFFF_t_70 1][] ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L01fRXZl_size_16_color_FFFFFF_t_70 2][] ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L01fRXZl_size_16_color_FFFFFF_t_70 3][] ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L01fRXZl_size_16_color_FFFFFF_t_70 4][] ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L01fRXZl_size_16_color_FFFFFF_t_70 5][]

###  部分代码实现： ###

/**
     * 加载目录
     */
    loadDir() {
    	let environment = plus.android.importClass("android.os.Environment");
    	// 判断SD卡是否插入(涉及到SDK的读取，最好先判断SDK是否插入)
    	// environment.getExternalStorageState() === environment.MEDIA_MOUNTED
    	// 获得sd卡根目录
    	let path = environment.getExternalStorageDirectory().getAbsolutePath();
    	this.rootPath = path;
    	let lastPath = uni.getStorageSync('lastPath');
    	// 如果上次打开过目录，则使用上次的路径
    	if(lastPath) {
    		path = lastPath;
    	}
    	this.getFiles({
    		fullPath: path,
    		isFile: false
    	});
    },
    /**
     * 获取文件夹内容
     * @param {Object} file
     */
    getFiles(file) {
    	if (!file.isFile) {
    		let dirs = [],
    			files = [];
    		let directory = new File(file.fullPath);
    		let arr = directory.listFiles();
    		this.path = file.fullPath;
    		arr.forEach(item => {
    			if (!item.isHidden()) {
    				if (item.isDirectory()) {
    					dirs.push({
    						name: item.getName(),
    						fullPath: item.getPath(),
    						isFile: false,
    					})
    				} else {
    					// 文件  
    					files.push({
    						name: item.getName(),
    						fullPath: item.getPath(),
    						isFile: true, // 是否是文件
    						isAdded: this.isAdded(item.getPath()) // 是否已经添加到文件列表页
    					})
    				}
    			}
    
    		})
    		this.fileList = [...dirs, ...files]
    	}
    },
    /**
     * 获取下一级目录文件
     * @param {Object} e
     * @param {Object} file
     */
    getNextFile(e, file) {
    	this.checkedAll = false;
    	if (file.isFile) {
    		this.$set(file, 'checked', !file.checked)
    		let checkedAll = true;
    		this.fileList && this.fileList.forEach(item => {
    			if (!item.checked && item.isFile) {
    				checkedAll = false;
    			}
    		});
    		this.checkedAll = checkedAll;
    		this.getCheckedFiles();
    	} else {
    		this.getFiles(file)
    	}
    }

### 源码链接（下载后可直接运行）： ###

> github:   https://github.com/Eveveen/uni-app-file-manager.git  
> 码云：https://gitee.com/m\_eve\_admin/uni-app-file-manager.git

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L01fRXZl_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20210107101303216.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L01fRXZl,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L01fRXZl_size_16_color_FFFFFF_t_70 1]: https://img-blog.csdnimg.cn/202101071014230.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L01fRXZl,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L01fRXZl_size_16_color_FFFFFF_t_70 2]: https://img-blog.csdnimg.cn/20210107101501935.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L01fRXZl,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L01fRXZl_size_16_color_FFFFFF_t_70 3]: https://img-blog.csdnimg.cn/20210107101526931.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L01fRXZl,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L01fRXZl_size_16_color_FFFFFF_t_70 4]: https://img-blog.csdnimg.cn/20210107101607416.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L01fRXZl,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L01fRXZl_size_16_color_FFFFFF_t_70 5]: /images/20221119/2724b855291e4767b9996ed9cf0fe043.png