异步函数连续运行

Question

我使用以下代码从react中的两个不同源获取数据。

const [ permissionTree, setPermissionTree ] = useState([]);
const [ availablePermissionsInRole, setAvailablePermissionsInRole ] = useState<Permission[]>([]);
const getAllPermissions = (): void => {
getPermissionList()
.then(response => {
if (response.status === 200 && response.data && response.data instanceof Array) {
const permissionStringArray = response.data;
let permissionTree: Permission[] = [];
permissionTree = permissionStringArray.reduce((arr, path) => addPath(
path, path.resourcePath.replace(/^/|/$/g, "").split('/'), arr,
), []);
setPermissionTree(permissionTree);
}
})
.catch(error => {
//Handle Permission Retrieval Properly
})
}
/**
* Retrieve permissions for a given role if in Role edit mode.
*/
useEffect(() => {
if (isEdit && roleObject) {
getPermissionsForRole(roleObject.id)
.then(response => {
if (response.status === 200 && response.data instanceof Array) {
const permissionsArray: Permission[] = [];
response.data.forEach(permission => {
permissionsArray.push({
id: permission,
isChecked: false,
fullPath: permission
})
})
setAvailablePermissionsInRole(permissionsArray);
getAllPermissions();
}
})
.catch(error => {
//Handle Role Retrieval Properly
})
} else {
getAllPermissions();
}
}, [])

第一个异步调用getPermissionsForRole返回一个字符串数组，第二个getAllPermissions返回一个对象数组，然后我将其解析为util方法以创建不同的对象数组。

使用空数组作为useEffect中的第二个参数，会停止连续异步调用，但当我在getAllPermissions方法中检查availablePermissionsInRole时，它是空的。当我传递availablePermissionsInRole作为第二个参数时，会发生连续循环。

我在这个代码中做错了什么。请指导我，因为我是新手。

Answer 1

我为useEffect的无限循环找到了一个解决方案，由于我将availablePermissionsInRole作为第二个参数传递，react只查看数组引用，并将其视为一个新数组，因此产生了无限循环。为了解决这个问题，我首先传递了以下内容作为参数。

availablePermissionsInRole.length

除非后端发送新的数组元素，否则其将保持不变。然后，数组中的字符串可以在不改变长度的情况下改变，所以我使用以下作为论据来解决我的问题。

availablePermissionsInRole.toString()

如果还检索到一个新字符串，则会发生变化。

感谢大家的帮助，但如果我使用的方法有任何错误，请务必指出。