Async Fetch Not Working When Retrieving Data From JSONPlaceholder API In JavaScript And Vue.JS

Hello,

I was trying to retrieve data from a Free Fake API website called JSON Placheholder using the code below which using asynchronous behavior. However, this does'nt return data after all.

 async getDataAsync(){ 
       try {
         let response = await fetch('http://jsonplaceholder.typicode.com/todos');
         console.log(response.data);
         this.todos = response.data;
       } catch (error) {
         console.log(error);
    }

After doing some research, I came up with a solution and replace the code above using JavaScript Promise as a means to retrieve data from the Fake API website in an asynchronous manner.

await fetch('http://jsonplaceholder.typicode.com/todos')
            .then(response => 
              response.json()
             )
            .then(data => {
              this.todos = data;
            })
            .catch(error => {
              return Promise.reject(error);
            });
    }

Cheers!