Я пытаюсь использовать хук useUser
из Supabase, чтобы получить пользователя, а затем построить запрос, используя идентификатор пользователя, но при первой загрузке страницы я получаю ошибку времени выполнения:
Unhandled Runtime Error
TypeError: Cannot read properties of null (reading 'id')
Source
pages/users/[id].js (52:30) @ id
50 | .select()
51 | .eq("user_id", id)
> 52 | .eq("follower_id", user.id);
Когда я обновляюсь, он работает нормально (я предполагаю, что хук useUser успел получить пользователя). Это соответствующий фрагмент кода.
import { useEffect, useState } from "react";
import supabase from "../../lib/supabase";
import { useUser } from "@supabase/auth-helpers-react";
function User({ props }) {
const [follows, setFollows] = useState(false);
const user = useUser();
const checkFollowStatus = async () => {
const { data, error } = await supabase
.from("follows")
.select()
.eq("user_id", id)
.eq("follower_id", user.id);
if (!error && data) {
console.info(data);
setFollows(true);
} else {
setFollows(false);
}
};
useEffect(() => {
checkFollowStatus();
}, []);
Перед вызовом user
необходимо проверить наличие checkFollowStatus
, см. этот пример https://supabase.com/docs/guides/auth/auth-helpers/nextjs#client-side-data-fetching-with-rls
В твоем случае:
useEffect(() => {
if (user) checkFollowStatus();
}, [user]);