Reactjs React useEffect钩子导致DomeException：请求权限需要用户激活

我有一个React

useffect

hook，可以读取用户先前批准的本地文件

要读取文件，它使用

[FileSystemHandle.queryPermission（）][1]

方法，如果未授予

权限，则将提示用户使用
FileSystemHandle.requestPermission（）方法进行访问

问题是，这发生在用户有机会与页面交互之前，这导致
doException:请求权限需要用户激活。
错误

有什么办法可以解决这个问题吗？
这是因为谷歌定义了用户激活的要求，并且现在已经纳入了

解决此问题的方法是将此操作作为
useffect
钩子的一部分从执行中删除，并提示用户首先执行该操作

在我的例子中，UI将显示一个需要更新内容的指示器，并用一个小按钮触发该操作。这符合用户激活条件，流程运行时不会出现错误

let file, perms

perms = await fileHandle.queryPermission()

if (perms === 'granted') file = await fileHandle.getFile()
else if (perms === 'prompt') {
  setButtonForRetry(true)
}