"TypeError： result is not iterable" -> Nextjs 13 data fetching with getStaticParams

Question

我从一个supabase数据库与Next js 13的新的抓取方法抓取数据。将用户获取到我的清单页面工作得很好，甚至当我单击他们的卡片时，URL也会更改为预期的段符。

然而，我似乎无法将数据获取到用户的页面，导致以下错误:

TypeError: result is not iterable

我的清单页面是这样的:

export const revalidate = 60;
async function getData() {
const {
data
} = await supabase.from("profiles").select().eq("is_host", true);
return { data };
}
export default async function Hosts() {
const data = await (getData());
return ( 
<div > 
{data.data!.map((profile) => ( 
<div >
<Link href = {`/hosts/${profile.username}`}
key = {profile.id} >
</Link>
))
} </div>

配置文件页面如下所示:

export const revalidate = 60;
export async function generateStaticParams() {
const { data: profiles } = await supabase.from("profiles").select("username");
const hostPath = profiles?.map((profile) => ({
params: {host: profile.username},
}))
return {
hostPath,
fallback: false,
}
}
export default async function HostPage({ params: { username } }: {params: {username: string}}) {
const {data: profile} = await supabase.from('profiles').select().match({username}).single()
return (
<div>
<pre>{JSON.stringify(profile, null, 2)}</pre>
</div>

都是服务器端渲染。

有人有什么想法吗?提前谢谢你。

更新:在抓取方法的返回语句中删除数据周围的{}后，一切都按预期工作(我将数组包装在一个对象中，不能映射)。

Answer 1

is not iterable是当你试图迭代一个不可迭代的类型时。

这里

const { data: profiles } =  await supabase.from("profiles").select("username");

profiles不是数组

你的意思是:

const hostPath = profiles?.data.map()