如何在NUXT3中使用其他方法或功能中获取的API结果
如何使用NUXT3中的API获取数据？
例如，我想从API的结果设置元数据，但它引发了一个未定义的错误。我无法访问pagedata usehead。
<script setup>
import { ref } from "vue"
const { apiUrl } = useRuntimeConfig()
const route = useRoute()
const { data: pageData } = await useFetch(
`${apiUrl}/misc/cmspage/61785b119b4eb50d8d625621`
)
useHead({
title: this.pageData.seo.metatitle
})
</script>
这是API的结果。
{
seo: {
metatitle: "SomeTitle",
metadesc: "SomeDescriptions",
metakeywords: "SomeKeywords",
},
pagename: "XXXXX",
faqs: [],
topDestinations: [],
pageId: "61785b119b4eb50d8d625621",
id: "61785b119b4eb50d8d625621",
}
How to work with fetched data from an API in Nuxt3?
For example, I want to set metatags from the API's results, but it throws an error of undefined. I am unable to access pageData in useHead.
<script setup>
import { ref } from "vue"
const { apiUrl } = useRuntimeConfig()
const route = useRoute()
const { data: pageData } = await useFetch(
`${apiUrl}/misc/cmspage/61785b119b4eb50d8d625621`
)
useHead({
title: this.pageData.seo.metatitle
})
</script>
This is the result of the API.
{
seo: {
metatitle: "SomeTitle",
metadesc: "SomeDescriptions",
metakeywords: "SomeKeywords",
},
pagename: "XXXXX",
faqs: [],
topDestinations: [],
pageId: "61785b119b4eb50d8d625621",
id: "61785b119b4eb50d8d625621",
}
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
您应该使用
pagedata.value.seo.metatitle打印参考文献的内容。请参见更多详细信息： https> https> https：// vuejs。 org/guide/Essentials/exiveitive-fundamentals.html＃vactive-variables-with-ref （切换到右上角的sidebar
api api preference）You should use
pageData.value.seo.metatitleto print the content of your ref.More details are available here: https://vuejs.org/guide/essentials/reactivity-fundamentals.html#reactive-variables-with-ref (switch to
compositionon the top right sidebarAPI preference)