Vonox
Vonox
PostsComments
NNuxt
Created by Vonox on 3/28/2024 in #❓・help
How to make a vertical menu like Storyblok
No description
1 replies
NNuxt
Created by Vonox on 1/17/2023 in #❓・help
Redirect user when useFetch fails
I'm trying to figure out how to redirect the user when useFetch fails. For example I have: 
<script setup>
const route = useRoute()
const { data } = useFetch('/api/products', {
  query: {
    id: route.params.id
  }
})
</script>
<script setup>
const route = useRoute()
const { data } = useFetch('/api/products', {
  query: {
    id: route.params.id
  }
})
</script>
Here I'm using the route param id the fetch a certain product. However, if I change the route param to an invalid id, the useFetch will fail and I want to redirect the user away from the page. How can I achieve this? I have tried the following without result: 
<script setup>
const route = useRoute()
const { data } = useFetch('/api/products', {
  query: {
    id: route.params.id
  },
  onResponseError() {
    const router = useRouter()
    router.push('/')
  }
})

// More code here
</script>
<script setup>
const route = useRoute()
const { data } = useFetch('/api/products', {
  query: {
    id: route.params.id
  },
  onResponseError() {
    const router = useRouter()
    router.push('/')
  }
})

// More code here
</script>
This doesn't seem to stop the rest of my script inside of <script setup> from executing.
8 replies