import React,{Component} from 'react';
import {View,Text,StyleSheet,Button,Alert} from 'react-native';
const f=require("react-native-fs");
export default class Fs extends Component{
constructor(props){
super(props);
this.data=[];//遍历结果
this.filecache=[];//缓存遍历过程中的文件夹
this.len=0;//缓存遍历过后的文件数量
this.states='';//当前遍历的文件夹路径
this.state={s:false};//刷新视图
}
async dir(path){//调用入口
if(path==""){return };
let data=await this.rd(path);
var reg=/.*?\.mp3$/i;//需要遍历的文件后缀名
for(let x=0,l=data.length;x<l;x++){
if(data[x].isDirectory()){
this.filecache.push(data[x].path);//是目录就缓存起来下次遍历
//不在这里使用递归是避免程序崩溃 测试过会造成程序卡死
}else if(data[x].isFile()&®.test(data[x].name)){
this.data.push(data[x]);//是需要的文件就保存起来
//data[x] 包含name文件名 path绝对路径 size文件大小 ctime 创建时间 ..............
}
}
this.Directory();//继续扫描缓存中的目录
}
rd(path){//封装RNFS
return new Promise((resolve,reject)=>{
return f.readDir(path).then(data=>{
resolve(data)
}).catch(e=>{reject(e)})
})
}
async pr(path){//用于直接获取promise的结果
return await this.rd(path);
}
Directory(){// this.dir 回调继续扫描
if(this.filecache.length>0){
let x=this.filecache[0];//第一个缓存目录路径
this.filecache.shift();//去掉第一个缓存目录
this.setData(x);//视图显示
this.dir(x);//回调
return ;
}else{
this.setData('扫描完成');
return false;}
}
setData(path){//反馈给用户的结果
this.states=path.replace(/\/storage\/emulated\/0/ig,'');
this.len=this.data.length;
this.setState({s:!this.state.s})
}
render(){
return (
<View>
<Button style={styles.bt} onPress={()=>{this.data=[];this.dir('/storage/emulated/0')}} title='扫描本地文件'/>
<Text> </Text>
<Button style={styles.bt} onPress={()=>{this.filecache=[]}} title='停止扫描' />
<Text>ScanFile:{this.states}</Text>
<Text> </Text>
<Text >共扫描出 <Text style={{color:'green'}}>{this.len}</Text> 个MP3文件</Text>
</View>
);
}
}
const styles=StyleSheet.create({
bt:{width:50,height:30,fontSize:20,color:'#ff0000'},
});
//第一次写有点粗糙 大家将就着看
