我需要在应用程序中实现错误处理。我正在使用弹出窗口添加用户组。发送请求后，如果来自后端，我需要显示错误消息。然而，我在理解JavaScript异步函数方面遇到了困难。我创建了一个useEffect钩子，如果出现错误，我使用useState设置它并在弹出窗口中显示它。但如果没有错误，我想关闭弹出窗口。问题是错误最初为null，因此没有产生副作用，我无法用if语句控制它。只有在收到一些错误并发送一个没有抛出错误的新请求后，弹出窗口才会关闭。我认为问题在于useEffect钩子。也许我应该在开始时初始化错误？任何帮助将不胜感激。下面是相关代码：
我遇到了一个问题，错误在一开始就已经为null，所以它不会产生副作用，我不能用if语句控制它。我希望在没有错误的情况下能够关闭弹出窗口。我如何才能做到这一点？

const RoleList: React.FC<RoleListComponentProps> = (props) => {
    useWebservice(true, loadUserRoles);
    const roles = useSelector(selectUserRoles);
    const selectedRole = useSelector(selectSelectedRole);
    let roleError: string | null = useSelector(selectUserRoleErrorMessage);
    const msalContext: IMsalContext = useMsal();
    const dispatch = useDispatch();

    // ...other state and functions...

    useEffect(() => {
        if (typeof roleError === "string" && roleError === "Employees: Request failed with status code 409") {
            setGroupNameError("This user group is already created before!");
        } else if (typeof roleError === "string") {
            setGroupNameError(roleError);
        } else {
            handleCloseAddGroupPopup();
        }
    }, [dispatch, roleError, handleCloseAddGroupPopup]);

    return (
        <ListComponent
            // ...other props...
        />
    );
};

export default RoleList;