File tree Expand file tree Collapse file tree 1 file changed +13
-5
lines changed Expand file tree Collapse file tree 1 file changed +13
-5
lines changed Original file line number Diff line number Diff line change @@ -40,25 +40,33 @@ export default defineNuxtConfig({
40
40
})
41
41
```
42
42
43
- 3 . Use the ` useMusicKit ` composable in your components :
43
+ 3 . Use the ` useMusicKit ` composable with proper initialization :
44
44
45
45
``` vue
46
46
<script setup>
47
- const { musicKit, isAuthorized } = useMusicKit()
47
+ const { getInstance, musicKitConnected, tokenExpired } = useMusicKit()
48
48
49
49
async function playSong() {
50
- await musicKit.setQueue({ song: '123456789' })
51
- await musicKit.play()
50
+ const musicKit = await getInstance()
51
+ if (musicKit) {
52
+ await musicKit.setQueue({ song: '123456789' })
53
+ await musicKit.play()
54
+ }
52
55
}
53
56
</script>
54
57
55
58
<template>
56
- <button @click="playSong" :disabled="!isAuthorized ">
59
+ <button @click="playSong" :disabled="!musicKitConnected || tokenExpired ">
57
60
Play Song
58
61
</button>
59
62
</template>
60
63
```
61
64
65
+ ** Available Composables:**
66
+ - ` getInstance(): Promise<MusicKitInstance> ` - Initialize and get MusicKit instance
67
+ - ` musicKitConnected: Ref<boolean> ` - Connection status
68
+ - ` tokenExpired: Ref<boolean> ` - Dev token expiration state
69
+
62
70
## Obtaining MusicKit Credentials
63
71
64
72
To use this module, you'll need to create a MusicKit key in your Apple Developer account:
You can’t perform that action at this time.
0 commit comments