How can I fetch data in a Nuxt.js application?

How can I fetch data in a Nuxt.js application?

You can fetch data in a Nuxt.js application using the asyncData or fetch methods. Would you like to see an example?

Yes, please provide an example using asyncData.

Sure! In your page component, you can define an asyncData method like this:

export default {
  async asyncData({ params }) {
    const response = await fetch(`https://api.example.com/data/${params.id}`);
    const data = await response.json();
    return { data };
  }
};

What if I want to fetch data on the client side?

For client-side fetching, you can use the mounted lifecycle hook. Here's an example:

export default {
  data() {
    return { data: null };
  },
  async mounted() {
    const response = await fetch('https://api.example.com/data');
    this.data = await response.json();
  }
};