Coding Challenge: Throw and Clear Errors

Problem statement

In this challenge, create a Nuxt project to throw a fatal error that is caught on the error.vue page. The error page should also have a button to clear the error and redirect to the home page. The project has an error.vue file that takes in the error as a prop and displays it in the template. There is also an index.vue page with a button that will be used to throw an error.

Complete the project by completing the following steps:

• In the error.vue file:

  • Call the handleError function when the button is clicked.

  • Add the correct helper method to the handleError function to clear the error. This should also redirect to the home page.

• In the index.vue file:

  • Throw an error when the button is clicked using the createError helper method.

  • Pass createError an object containing a statusMessage and fatal:true. The fatal property is required to trigger the full-page error.

Try it yourself

You can implement your solution in the code widget provided below.

If you’re unsure how to do this, click the “Show Hint” button.