我在一个项目中使用 nuxt 3，我想向 /server/api/ 目录中的打字稿文件发出请求。但是当我在文件 app.vue 中这样做时：
<script setup lang="ts">
const createPerson = async () => {
console.log('create person')
const data = await useAsyncData('createPerson', () => $fetch('/api/file', {
method: 'POST',
headers: useRequestHeaders(['cookie']),
body: JSON.stringify({
lastname: fields.value.lastname,
firstname: fields.value.firstname,
age: fields.value.age,
x: fields.value.x,
y: fields.value.y,
bio: fields.value.bio
})
}))
console.log(data)
}
</script>
当我调用这个函数createPerson时：
<button @click="createPerson">Apply</button>
我的应用程序仅获取“/api/file”一次，并且不会重新获取。如果我使用 useAsyncData 提供的刷新功能，第一次单击按钮时我有两次获取，一次获取后。
要回答您的问题，您需要添加一个密钥来使用AsyncData来强制刷新您的请求。未发生重新获取的原因是
createPerson作为密钥保持不变，因此不会执行重新获取。 因此，您所需要做的就是使用您喜欢的 useAsyncData 方法生成随机密钥<script setup lang="ts"> const createPerson = async () => { console.log('create person') const data = await useAsyncData(RANDOM_KEY, () => $fetch('/api/file', { method: 'POST', headers: useRequestHeaders(['cookie']), body: JSON.stringify({ lastname: fields.value.lastname, firstname: fields.value.firstname, age: fields.value.age, x: fields.value.x, y: fields.value.y, bio: fields.value.bio }) })) console.log(data) } </script>您还可以选择使用刷新功能，而不必担心密钥。检查此文档 https://nuxt.com/docs/getting -started/data-fetching#refreshing-data