docs: use useAsyncData

atinux · web-flow · commit 26d7197384d4 · 2025-02-06T17:18:45.000+01:00
diff --git a/docs/content/docs/3.files/2.yaml.md b/docs/content/docs/3.files/2.yaml.md
@@ -46,14 +46,20 @@ url: https://github.com/larbish
 
 Now we can query authors:
 
-```ts
+```vue
+<script lang="ts" setup>
 // Find a single author
-const theAuthor = await queryCollection('authors')
-  .where('stem', '=', 'larbish')
-  .first()
+const { data: author } = await useAsyncData('larbish', () => {
+  return queryCollection('authors')
+    .where('stem', '=', 'larbish')
+    .first()
+})
 
 // Get all authors
-const authors = await queryCollection('authors')
-  .order('name', 'DESC')
-  .all()
+const { data: authors } = await useAsyncData('authors', () => {
+  return queryCollection('authors')
+    .order('name', 'DESC')
+    .all()
+})
+</script>
 ```
