Vue是一個流行的JavaScript框架，用于構建單頁面和復雜的Web應用程序。Vue具有易于理解和快速上手的API，使其成為開發人員的首選框架之一。本文將詳細介紹如何使用Vue進行Django的Django Rest Framework（DRF）API的GET請求。

首先，我們需要引入Vue和Axios庫，因為Axios是一個流行的HTTP客戶端庫，用于向服務器發送請求并處理響應。

import Vue from 'vue'
import axios from 'axios'
Vue.prototype.$http = axios

一旦我們引入了Vue和Axios，我們就可以開始使用它們了。首先，我們需要在Vue組件中定義我們的數據和發送請求的方法。

export default {
data () {
return {
results: []
}
},
methods: {
fetchData() {
this.$http.get('http://localhost:8000/api/data/')
.then((response) =>{
this.results = response.data
})
.catch((error) =>{
console.log(error)
})
}
},
mounted() {
this.fetchData()
}
}

在上面的代碼中，我們定義了一個data對象，其僅包括一個名為results的空數組。然后，我們定義了一個名為fetchData的方法，該方法使用this.$http.get()方法從我們的API中獲取數據。如果請求成功，則響應數據將包含在響應對象的data屬性中。我們將數據存儲在results數組中。如果請求失敗，將調用catch塊，并在控制臺中打印來自服務器的錯誤消息。

最后，我們在mounted鉤子中調用fetchData方法，以便在組件加載時自動獲取數據。

簡而言之，我們可以使用Vue和Axios輕松地進行Django Rest Framework的GET請求。在這篇文章中，我們學習了Vue組件的data和methods屬性以及使用Axios進行REST API請求的步驟。這使得數據在Vue組件中處理和顯示變得更加容易。