\r\n \u003Cbutton class=\"btn btn-primary\" @click=\"sendIt\">Send\u003C/button>\r\n \u003C/div>\r\n\u003C/template>\r\n\r\n\u003Cscript setup>\r\nconst body = reactive({\r\n foo: 'bar',\r\n name: '',\r\n});\r\n\r\nconst sendIt = async () => {\r\n const { data, error } = await useFetch('https://httpbin.org/anything', {\r\n method: 'POST',\r\n body,\r\n });\r\n};\r\n\u003C/script>\r\n```\n\n### Describe the bug\n\nWhen POSTing a reactive Vue object using `useFetch`, I find that further modification of the object's properties causes the `useFetch` call to unexpectedly fire again for each modification.\r\n\r\nIn the above example, I have a reactive object named `body`, and I use `useFetch` to POST it somewhere. Afterward, if I modify the object using an `\u003Cinput>` with `v-model` binding, that `useFetch` POST fires again for each keypress. If I click Send to trigger `useFetch` once more, then modify the object's properties yet again, the `useFetch` calls invoked by those modifications have doubled up, and they continue to double with each click of the Send button.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2075,2076],{"name":1998,"color":1999},{"name":1985,"color":1986},23837,"useFetch calls repeat when sending and modifying reactive objects","2023-10-20T21:12:43Z","https://github.com/nuxt/nuxt/issues/23837",0.65998447,{"description":2083,"labels":2084,"number":2087,"owner":1988,"repository":1988,"state":2002,"title":2088,"updated_at":2089,"url":2090,"score":2091},"### Environment\n\nNuxt 3 latest version\n\n### Reproduction\n\nthis cannot be done because there is no open service that will provide such an api to reproduce it. Can you advise me? I need an error to arrive at the same url, and then a callback occurs, but only without an error if the headers are correct.\n\nhttps://stackblitz.com/edit/nuxt-starter-74zqym?file=plugins%2Fapi.ts\n\n\n\n\n\n\nWhen the useFetch request is repeated, the data does not change. The fact is that when I go to the page where the USEFETCH wrapper is used, the data is processed correctly, but if in case of a 401 authorization error I need to call an additional function, a token request, after which I return the original function, the data does not change. How do I return the current data to the template? Hint. If done in useApi\n\n```\nexport async function useAPI\u003CT>(url: string | (() => string), options?: UseFetchOptions\u003CT>) {\n const response = await useFetch(url, {\n ...options,\n $fetch: useNuxtApp().$api,\n isUseFetch: true,\n })\n\n if (response.data.value.statusCode === 401) {\n await response.clear()\n await response.refresh()\n\n return response\n }\n\n return response\n}\n```\n\nclear() and refresh() then everything works properly, but there is a problem of hydration. How can I make the data in the component reactive and get the values from the second request?\n\n### Describe the bug\n\nI have tried many different ways, but there is a feeling that the problem is in nuxt. \n\nhttps://nuxt.com/docs/guide/recipes/custom-usefetch\n\nThe problem occurs at the moment when you press f5 on the page itself, and it gives a 401 error on the ssr side, then calls the method to get new tokens, and should call that very first request and get the data, but I have an error in the variable from that first request\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2085,2086],{"name":1985,"color":1986},{"name":2057,"color":2045},29378,"When the useFetch request is repeated, the data does not change","2024-10-16T17:25:36Z","https://github.com/nuxt/nuxt/issues/29378",0.6614043,["Reactive",2093],{},["Set"],["ShallowReactive",2096],{"TRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"4E3SX2BQ5wgkrHTRTmTvnxvVjAcUwyUbC5MeHEq4Ae8":-1},"/nuxt/nuxt/15528"]