What are promises in Vue.js and how do they work?

What are promises in Vue.js and how do they work?

Promises in Vue.js are used to handle asynchronous operations. They represent a value that may be available now, or in the future, or never.

Can you give me an example of how to use promises in a Vue component?

Sure! You can use promises in a Vue component like this:

methods: {
  fetchData() {
    return new Promise((resolve, reject) => {
      // Simulate an API call
      setTimeout(() => {
        resolve('Data fetched!');
      }, 1000);
    });
  }
}

Then call fetchData() in your component.

What happens if the promise is rejected?

If a promise is rejected, you can handle the error using the .catch() method. For example:

this.fetchData()
  .then(data => console.log(data))
  .catch(error => console.error('Error:', error));

Are there any best practices for using promises in Vue.js?

Yes, some best practices include using async/await for cleaner syntax, handling errors properly, and avoiding nested promises.