我想做一个递归函数，它基本上在每次文件夹下有一个子文件夹时运行，所以我可以从所有可用的子文件夹中获取所有内容。
不确定我在这里缺少什么，但是子文件夹的状态更改不会触发将其作为依赖项的 useEffect：
const [imageList, setImageList] = useState([]) as any;
const [subFolders, setSubFolders] = useState([]) as any;
const getFilesFromFolder = (fileId: string) => {
let noToken = false;
const requestFunction = ((pageToken?: string) => {
gapi.client.drive.files.list({
q: `'${fileId}' in parents`,
pageToken
}).execute((res: any) => {
const token = res.nextPageToken && res.nextPageToken || null;
const images = res.files.filter((file: any ) =>
file.mimeType === 'image/jpeg' ||
file.mimeType === 'image/png' ||
file.mimeType === 'image/jpg'
);
setSubFolders([...subFolders, ...res.files.filter((file: any ) => file.mimeType === 'application/vnd.google-apps.folder')]);
setImageList([...imageList, ...images])
if (token) {
requestFunction(token);
} else {
noToken = true;
}
}).catch((err: any) => {
console.log('err', err)
})
});
if (!noToken) {
requestFunction();
}
}
useEffect(() => {
if (subFolders && subFolders.length > 0) {
subFolders.forEach((subFolder: any) => {
getFilesFromFolder(subFolder.id);
});
}
}, [subFolders])
由于您基本上是在循环文件结构和排队状态更新，因此我将假设您遇到的任何问题都是因为您使用的是正常状态更新。当这些在循环中排队或在渲染周期内多次排队时，它们会覆盖先前排队的更新。
要解决您应该真正使用功能状态更新。这样每次更新都可以正确更新前一个状态，而不是前一个渲染周期的状态。这是一个微妙但重要的区别，并且经常被忽视。
setSubFolders(subFolders => [
...subFolders,
...res.files.filter((file: any ) =>
file.mimeType === 'application/vnd.google-apps.folder'
),
]);
setImageList(imageList => [...imageList, ...images]);
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句