Vue.js 是一款流行的前端 JavaScript 框架，它提供了許多有用的模塊和庫，讓您輕松構建極具交互性和可擴展性的 Web 應用程序。其中一個最重要的模塊是該框架的 $http 服務，它可以讓您從 Vue.js 應用程序中發起 HTTP 請求。本文將介紹如何使用 Vue.js 的 $http 服務。

要使用 Vue.js 的 $http 服務，首先需要安裝 vue-resource 模塊，可以通過 NPM 包管理器進行安裝。在您的項目根目錄下，執行以下命令：

npm install vue-resource --save

安裝完成后，您需要在您的 Vue.js 組件中引入 vue-resource 模塊，通過 Vue.use() 方法進行注冊。以下是一個簡單的示例：

// 引入 vue-resource 模塊
import VueResource from 'vue-resource'
// 注冊 vue-resource 模塊
Vue.use(VueResource)

安裝并注冊完成后，$http 服務將可以在您的組件代碼中使用。通過該服務，您可以很方便地發起 GET、POST、PUT、PATCH 和 DELETE 請求，同時支持 Promise 和 JSONP。以下是一個示例 Vue.js 組件代碼，演示了如何使用 $http 服務發起 HTTP 請求：

<template>
<div>
<p>{{ message }}</p>
</div>
</template>
<script>
export default {
data () {
return {
message: ''
}
},
methods: {
fetchData () {
// 發起 GET 請求
this.$http.get('https://jsonplaceholder.typicode.com/posts/1').then(response => {
// 獲取響應數據
this.message = response.body.title
}, error => {
console.log(error.statusText)
})
}
},
mounted () {
// 在組件掛載后立即發起數據獲取操作
this.fetchData()
}
}
</script>

上述代碼中，fetchData() 方法觸發了 GET 請求，該請求獲取來自 JSONPlaceholder REST API 的數據。一旦響應返回，它會將 message 數據綁定到 API 響應中的標題字段。這是一個非常基本的 Vue.js 組件代碼，但它展示了如何使用 $http 服務從 Vue.js 應用程序發起 HTTP 請求。