paper-dynasty-website/pages/players/[id].vue
2025-05-07 13:29:06 -05:00

39 lines
952 B
Vue

<script setup lang='ts'>
import type { Player } from '~/types/Player'
const route = useRoute()
const playerId = route.params.id
const client = useSupabaseClient()
const { data: player, pending, error } = await useAsyncData<Player | null>(
'players',
async () => {
const { data } = await client.from('players')
.select('*,rarity!inner(*)')
.eq('id', playerId)
.single()
console.log(`player:`)
console.log(data)
return data
},
{
lazy: true,
server: false
}
)
</script>
<template>
<h2>Get One Card!</h2>
<div>
<div v-if="pending">Loading...</div>
<div v-else-if="error">Failed to load player</div>
<div v-else-if="!player">No playler found</div>
<div v-else>
<Player :player="player" />
</div>
</div>
</template>