🕌

Nextjs×Prisma×SQLiteでreadする方法(その2)

2022/12/22に公開約800字

1つのデータを取得するためには、まずデータのIDを取得しなければならないので、そこから始めます。
IDはurlから取得することにします。

./pages/post/[id].tsx
export default function Post({id}:{id:number}) {
    return(
            <p>{id}</p>
    )
}
export async function getServerSideProps({params}:{params:{id:number}}) {
    const id = params.id
    return {
        props: {
            id: id
        }
    }
}

[id].tsxとすることでgetServerSideProps内でparams.idを取得しています。
例えば、localhost:3000/post/1を直接叩くとparams.idは1となります。

export async function getServerSideProps({params}:{params:{id:number}}) {
    const id = params.id
    return {
        props: {
            id: id
        }
    }
}

取得したidをhtmlとして表示しています。

export default function Post({id}:{id:number}) {
    return(
            <p>{id}</p>
    )
}

これでIDの取得ができそうです。
次回は取得したIDから一つのデータを取得してみようと思います。

Discussion

ログインするとコメントできます